电商网站建设标准,鞍山市网站建设,养殖场网站源码,网站开发面试题在异步操作里为状态属性赋值#xff0c;需要放在 runInAction 里#xff0c;否则会有警告错误
使用 store#xff0c;所有使用 store 的组件#xff0c;为了感知状态数据的变化#xff0c;需要用 observer 包装#xff0c;对应着图中 reactions
import { Input } from …在异步操作里为状态属性赋值需要放在 runInAction 里否则会有警告错误
使用 store所有使用 store 的组件为了感知状态数据的变化需要用 observer 包装对应着图中 reactions
import { Input } from antd;
import StudentStore from ../store/StudentStore;
import { observer } from mobx-react-lite;
import {runInAction} from mobx
import A71 from ./A71;
import A72 from ./A72;
import Search from antd/es/input/Search;
/* export default */ function A7() {// function onChange(e: React.ChangeEventHTMLInputElement) {}//如果觉得上面的写法复杂,可以写成下面的形式 Input onChange{(e){}}/Input,e就代表事件对象return ({/* e.target.value就代表文本框里面输入的值,当在文本框里面输入内容之后数据已经存入到了StudentStore里面了页面的数据并没有同步变化,这是因为A7组件并没有感知到StudentStore里面数据的变化函数组件并没有重新被调用要想A7感知到store里面数据的变化需要借助observer方法,使用observer方法之后,就不默认导出A7而是使用export default observer(A7),这样observer函数就能观察到A7内store里面数据的变化数据变化之后它就会重新调用A7,observer就对应着Reactions(状态数据发生改变后要执行的操作,这里执行的操作是P7被重新渲染)*/}InputonChange{(e) {StudentStore.setName(e.target.value);}}/InputSearchstyle{{ width: 150 }}placeholder请输入编号onSearch{(v) {StudentStore.fetch(Number(v));}}/Searchh1组件0:{StudentStore.student.name} {StudentStore.displayName}/h1h1组件0: {StudentStore.displayName}/h1h1组件0: {StudentStore.displayName}/h1A71/A71A72/A72/);
}
export default observer(A7);
