我做错了什么钩子相关

Question

我是钩子的新手，所以我会问这个问题：

如何在 onChange 函数中合法地使用 setState？

  {
    const state = useState([{date: date}]);
  };

这将引发错误:(

预期：更新状态结果错误消息：钩子只能在函数组件的主体内部调用。

我确实在网上找到了一些关于安装多个 React 版本的答案，但这里的情况并非如此:)

Answer 1

你需要在

主组件函数的主体中声明你的钩子：

const MyComponent = () => {
    // declaring your useState Hook - it returns a getter and setter
    const [date, setDate] = useState(null)
    const myCallback = (newDate)=>{
     // you can read the state
     const state = date;
      // or, you can do the equivalent of setState
       setDate(newDate)
    }
    return // return your .jsx
}

需要注意的是，你声明了一次钩子，它返回两个参数，一个getter和一个setter。从那时起，您仅使用吸气器和二传手与原始钩子进行交互。

对于您的粘贴代码：

const [myState,setMyState] = useState(
  {
    name: "",
    type: props.navigation.getParam("serviceName"),
    date: "15-05-2018",
    imageURI: props.navigation.getParam("imageURI")
  });
 const handleChange = e =>  {
   setMyState(prevState=> {...prevState, name: e.nativeEvent.text})
 };

(我用过myState和setMyState但它们可以是你喜欢的任何东西(

Answer 2

嗯，看来你弄错了...

当我们使用钩子时，没有像类那样的单一状态，

const [item, setValue] = useState(null)

这会将状态变量"ITEM"设置为初始值为 null。现在我们可以使用 "setValue" 将 "item" 的值更改为我们想要的值，如下所示设置值(5(。没有像类组件那样的 setState。由于状态变量的值已更改，因此组件将重新渲染。我们可以声明多个状态变量，例如

const [newitem, setnewItemValue] = useState(null)，每当状态变量更改时，组件将重新渲染