React：设置状态的多种方式

Question

在 React 中使用 State 有两种不同的方式吗？

1. 我刚读了一个资源，这是函数中的一个方法

   const [searchTerm, setSearchTerm] = React.useState('');
   setSearchTerm('abc');
   

2. 另一个使用this.state属性

   this.state ..
   
   this.setState({
       searchTerm: 'abc' // enter values here
    });
   

我应该什么时候使用这两种方法？我正在使用带有函数的 React 16 并询问差异。

Answer 1

使用这些状态取决于您的组件。

如果你用functional component，你可以用

const [searchTerm, setSearchTerm] = React.useState('');
setSearchTerm('abc');

或者，如果你使用class component，你可以使用

this.state ..

this.setState({
    searchTerm: 'abc' // enter values here
 });

Answer 2

第一个是反应钩子，用于功能组件。如果您正在创建功能组件，那么您必须使用钩子来使用状态。

第二个用于 class 个组件。如果您正在创建 class 组件，那么您可以使用状态对象，然后使用 this.setState

更新状态