Javascript 类型为function的无状态功能组件prop不';t更新
我不知道如何准确地描述我面临的问题,所以这个标题可能没有什么意义 我使用的是react 15.4.2和mobx 3.0.0 我有一个无状态的Javascript 类型为function的无状态功能组件prop不';t更新,javascript,reactjs,mobx,Javascript,Reactjs,Mobx,我不知道如何准确地描述我面临的问题,所以这个标题可能没有什么意义 我使用的是react 15.4.2和mobx 3.0.0 我有一个无状态的Blah功能组件,它接受一个对象东西作为道具。 事物具有可观察的属性。 正如预期的那样,当传入不同的实例时,Blah组件会相应地更新。 Blah组件有另一个组件,它基本上是react dropzone组件的包装,称为DzComponent 传递给react dropzone组件的参数之一是success事件处理程序。当我们丢弃某个东西并成功上载时,将调用此函
Blah
功能组件,它接受一个对象东西作为道具。
事物
具有可观察的属性。
正如预期的那样,当传入不同的实例时,Blah组件会相应地更新。
Blah
组件有另一个组件,它基本上是react dropzone组件的包装,称为DzComponent
传递给react dropzone组件的参数之一是success
事件处理程序。当我们丢弃某个东西并成功上载时,将调用此函数
问题在于这一系列事件:
Blah
用thing实例调用A
DzComponent
正确获取handleImageUpload
参考。i、 e.一旦成功,当我们称之为“道具.事物.可观察的”
时,它指的是实例A
Blah
用thing实例调用B
DzComponent
似乎仍然引用旧的handleImageUpload
引用。i、 e.成功后,props.thing.observable
仍指实例A
,而不是预期的实例B
如何让事件处理程序更新正确的实例
Blah.jsx
import React from 'react';
import {observer} from 'mobx-react';
function Blah(props) {
function handleImageUpload(evt, res) {
props.thing.observable = res.image_url
}
return (
<div>
<div>blah blah blah {props.thing.otherObservable}</div>
<DzComponent success={handleImageUpload}></DzComponent>
</div>
)
}
Blah.propTypes={
thing: React.PropTypes.object
}
export default observer(Blah)
从“React”导入React;
从'mobx react'导入{observer};
功能废话(道具){
函数handleImageUpload(evt,res){
props.thing.observable=res.image\u url
}
返回(
废话废话废话{道具。东西。其他可观察的}
)
}
诸如此类={
事物:React.PropTypes.object
}
导出默认观察者(Blah)
DzComponent.jsz
import React from 'react';
import DropzoneComponent from 'react-dropzone-component';
function DzComponent(props) {
return <DropzoneComponent></DropzoneComponent>
}
export default observer(DzComponent);
从“React”导入React;
从“react dropzone component”导入DropzoneComponent;
功能组件(道具){
返回
}
导出默认观察者(DzComponent);
我刚检查过
一切正常
也许您在DzComponent
或DropzoneComponent
componenthmmm上有一个bug。谢谢您的帮助。很高兴知道它会起作用。我将重新检查我的代码。