gpt4 book ai didi

reactjs - componentDidUpdate prevProps 给我当前/新的 Prop

转载 作者:行者123 更新时间:2023-12-03 13:39:13 26 4
gpt4 key购买 nike

我正在尝试整合传单 map ,但我认为这不是这里的问题。无论如何,要重新渲染我的 map ,我想使用 componentDidUpdate 来查看 Prop 是否更改,我从父组件传递到我的 map 组件。但现在问题来了,每当我尝试 console.log(prevProps.xx, this.props.xx) 它们都是完全相同的,即使我刚刚更新了它,所以我真的不能使用componentDidUpdate,还有其他方法吗?而且 componentWillReceiveProps 也不起作用,当我更新父组件的状态并将其传递给我的 map 组件时,它总是 1:1 相同,所以无法比较。

这是我的代码:

var Map = React.createClass({

map: null,
tileLayer : null,

componentDidMount: function() {
// code to run just after the component "mounts" / DOM elements are created
// make the AJAX request for the GeoJSON data
// create the Leaflet map object
if (!this.map) this.init('mapid');
},
componentWillReceiveProps: function(nextProps) {
console.log(nextProps.labels, this.props.labels);
},
componentDidUpdate(prevProps, prevState) {
const zoom = this.props.labels.zoom;
const mapstyle = this.props.labels.mapstyle;
const latlng = [this.props.labels.lat, this.props.labels.lng];
this.map.setView(latlng);
this.tileLayer.setUrl(mapstyle);
console.log(prevProps.labels, this.props.labels);
},

init: function(id) {
const zoom = this.props.labels.zoom;
const mapstyle = this.props.labels.mapstyle;
const latlng = [this.props.labels.lat, this.props.labels.lng];
if (this.map) return;
// this function creates the Leaflet map object and is called after the Map component mounts
this.map = L.map(id).setView(latlng,zoom);


// a TileLayer is used as the "basemap"
this.tileLayer = L.tileLayer(mapstyle).addTo(this.map);

// set our state to include the tile layer
},
render: function(){
return(
<div></div>
)
},

});

最佳答案

  1. 创建一个新的状态元素,例如response
  2. 将 Prop 分配给响应
  3. 尝试在 render() 中编写函数

关于reactjs - componentDidUpdate prevProps 给我当前/新的 Prop ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39401607/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com