页面多组件 antd 多组件调用同一接口

页面复杂   用的不只是一个组件是  例如ProForm  和ProTable  时   不能用自带的request  多次请求数据  自定义一个函数取一次性调用  然后setState()保存对应的值。分配给下面组件

技巧一：若request使用造成异步请求不同步时   用双标签 中间变量显示数据

问题一：

调用完接口  条件渲染数据/组件时  条件是变量  却延时输出  导致组件渲染错误，

归纳与：React中响应式数据变了界面却未更新

原因：属于数据发生改变后  组件没有再次渲染，但是react是数据改变-视图也会随之改变，考虑Props和setState是否改变。这里的问题是因为作为变量的是数组，数组是引用数据类型，数组是引用类型直接赋值再修改，会导致引用未变 。

解决方案：

在useState修改后，useEffect其实未监听到。所以要重新创建一个数组，新的数组会被监听到。

注：基本数据类型会被直接监听，引用数据类型因为值变地址不变  会导致未被检测，数据未及时更新。

需求一：点击列表切换旁边的表格内容。

onRow={(record)=>{
  return {
    onClick: () => {
      // 逻辑代码 存储行数据  数据给到表格          
    },
  }
}}

其他参考内容：

作者：寸志
链接：https://www.zhihu.com/question/584751472/answer/2902906013
来源：知乎

在 React 中，如果有数据但是没有渲染出来，通常有以下几个可能的原因：

1、渲染位置不正确

如果数据已经传入了组件，但是在渲染时没有找到数据应该呈现的位置，那么数据自然就不会被渲染出来。这种情况可以通过检查组件的 props 和 state 来确定数据是否被传递到了组件，并检查 JSX 中对应的位置是否正确。

2、setState 异步更新

在 React 中，setState 是异步更新状态的，这意味着在执行 setState 后，组件并不会立即重新渲染。如果组件中需要使用 setState 更新状态，然后基于新的状态进行渲染，那么就需要等到下一次组件更新时才能看到渲染结果。

解决方法是使用回调函数或者 componentDidUpdate 生命周期函数，在 setState 回调函数或 componentDidUpdate 中获取最新的 state，然后进行渲染。

3、数据更新没有触发重新渲染

React 通过检测组件的 props 和 state 是否发生变化来决定是否重新渲染组件。如果数据发生了变化，但是组件的 props 和 state 没有改变，那么组件就不会重新渲染，从而导致数据没有被更新。

可以使用 shouldComponentUpdate 生命周期函数来控制组件何时重新渲染。或者使用 React 中提供的一些工具来确保数据变化能够正确地触发组件的重新渲染，例如使用 React Hooks 中的 useState、useEffect 等。

4、组件渲染顺序不正确

在 React 中，组件的渲染顺序是由组件的层级关系和数据的传递方式决定的。如果数据在组件间传递时出现了错误，可能会导致组件的渲染顺序不正确，从而导致数据无法正确地渲染出来。

解决方法是仔细检查组件的层级关系和数据的传递方式，确保组件的渲染顺序是正确的。

总之，当有数据却没有被渲染出来时，需要仔细检查代码，确定数据是否传递到了组件，并且在正确的位置进行渲染。如果确定数据已经传递到了组件但是没有被渲染出来，需要考虑更新状态的异步性、数据更新是否触发重新渲染、组件渲染顺序是否正确等可能的问题。