react_12

在异步操作里为状态属性赋值，需要放在 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.ChangeEvent) {}
  //如果觉得上面的写法复杂,可以写成下面的形式 {}}>,e就代表事件对象

  return (
    <>
      {/* e.target.value就代表文本框里面输入的值,当在文本框里面输入内容之后，数据已经存入到了StudentStore
    里面了，页面的数据并没有同步变化,这是因为A7组件并没有感知到StudentStore里面数据的变化，函数组件并没有
    重新被调用，要想A7感知到store里面数据的变化，需要借助observer方法,使用observer方法之后,就不默认导出A7
    而是使用export default observer(A7),这样observer函数就能观察到A7内store里面数据的变化，数据变化之后，
    它就会重新调用A7,observer就对应着Reactions(状态数据发生改变后要执行的操作,这里执行的操作是P7被重新渲染)
    */}
       {
          StudentStore.setName(e.target.value);
        }}
      >
       {
          StudentStore.fetch(Number(v));
        }}
      >
      
组件0:{StudentStore.student.name} {StudentStore.displayName}
      
组件0: {StudentStore.displayName}
      
组件0: {StudentStore.displayName}
      
      
    
  );
}
export default observer(A7);