react-native - 使用 useState 钩子，但是 setter 函数在运行时未定义

Question

我useState在我的 react-native 项目中使用钩子。我有一个屏幕可以呈现我的自定义组件，名为MyComponent. state 的 setter 函数在MyComponent的onSelected回调中被调用。

import React, {useState} from 'react';
import MyComponent from './components/MyComponent'

const MyScreen=()=> {
  ...
  const {parts, setParts} = useState(initialParts);

  return (<View>
           <MyComponent onSelected={()=> {
                                 ...
                                 setParts(newParts)
                                   }}/>
        </View>)
}
...

MyComponent看起来像这样，在 的onPress回调中TouchableOpacity，它调用了传入的onSelected函数：

const MyComponent= ({onSelected})=> {
  ...
  return (<TouchableOpacity onPress={()=>{
                                      onSelected();
                                      ...
                                      }}>
           ...
          </TouchableOpacity>)
 }

当我在 iOS 模拟器上运行我的应用程序时，屏幕显示，当我点击 MyComponent 时，我得到 error TypeError: setParts is not a function. (In setParts(newParts)), 'setParts' is undefined。

为什么我会收到此错误？

标签： react-nativereact-hooks

Answer 1

您在这里的解构似乎是错误的：

  const {parts, setParts} = useState(initialParts);

不应该是这样的：

  const [parts, setParts] = useState(initialParts);

?