React函数组件中如何正确获取状态数组的长度？

你当前代码里的setError.length获取的是状态更新函数的参数个数，不是错误数组的长度。setError是React提供的状态更新方法，本身是个函数，它的length属性表示这个函数接受的参数数量（这里setError最多接受1个参数，所以返回1），和你存储错误的状态完全无关。

下面是两种正确的解决方式：

1. 直接使用现有错误数组的长度 #

你已经在catch块里拿到了error.errors这个最新的错误数组，直接访问它的length即可：

async function validate(value) { 
    try {
      const result = await schema.validate(value, { abortEarly: false });
      console.log(result);
      return result;
    } catch (error) {
      console.log(error.errors);
      setError({errors:error.errors});
      // 直接用error.errors的长度
      console.log(error.errors.length);
    }    
  }

这是最直接高效的方式，因为你已经拥有最新的错误数据，无需从状态中读取。

2. 监听状态变化获取最新长度 #

如果必须要在状态更新完成后获取最新的长度（比如需要基于更新后的状态做后续操作），可以用useEffect监听状态变量：

首先确保你正确声明了状态变量：

const [errorState, setError] = useState({ errors: [] });

然后添加useEffect监听：

useEffect(() => {
  // 状态更新后，这里会拿到最新的errorState
  console.log(errorState.errors.length);
  // 在这里执行需要用到最新长度的逻辑
}, [errorState]); // 当errorState变化时触发该effect

注意：React的状态更新是异步的，调用setError后，errorState不会立即更新，所以不要在setError之后直接访问errorState，否则拿到的是更新前的旧值。

内容的提问来源于stack exchange，提问作者Mohammad Mahdi