Question

我在 React Native 工作，我使用 picker 作为下拉菜单

  <Picker
         style={styles.picker}
         selectedValue={selectedsubject}
         onValueChange={(subjectValue) => pickerActivity(subjectValue)}>
          {allsubjects.map((item, index) => {
                            return (<Picker.Item label={item} value={item} key={index} />)
           })}
   </Picker>

onValueChange prop 我正在调用这个函数：

const pickerActivity = (val) => {
        setselectedsubject(val)
        console.log("============")
        console.log(val)
        console.log(selectedsubject)
        console.log("============")

    }

因此，当从菜单项中选择值时，我将所选值传递给此函数中的函数 pickerActivity，我将状态 selectedsubject 更新为传递的值，然后控制状态和值，然后在列表我有两个值让说 (value1 and value2)，所以假设我按下了 value1，所以发生了什么：它只控制台记录传递的值，对于状态它控制台记录空字符串，如下所示:

[Sat Jan 23 2021 19:43:28.899]  LOG      ============
[Sat Jan 23 2021 19:43:28.900]  LOG      value1
[Sat Jan 23 2021 19:43:28.901]  LOG      
[Sat Jan 23 2021 19:43:28.902]  LOG      ============

第二次，例如当我从下拉菜单中按下 value2 时，传递的值将是 value2，它是正确的，但对于状态，它将显示从 {{1} }}如下图：

value1

所以问题是状态不会从第一次更新，这里是我的状态：

[Sat Jan 23 2021 19:43:28.899]  LOG      ============
[Sat Jan 23 2021 19:43:28.900]  LOG      value2
[Sat Jan 23 2021 19:43:28.901]  LOG      value1
[Sat Jan 23 2021 19:43:28.902]  LOG      ============

Answer 1

你应该像这样用大写字母定义set-state函数。

const [selectedsubject, setSelectedsubject] = useState('');

现在，您在状态更新之前调用 console.log。要查看更新的状态，您需要使用 useEffect，它仅在 state updates 上触发：

useEffect(() => {
  console.log(selectedsubject);
})

Answer 2

使用 useState hook 提供的 updater 进行状态更新是异步的，不会立即反映。

即使 setselectedsubject(val) 被触发，selectedsubject 值也不会立即更新。它将保留以前的值。

反应本机选择器值未正确更新

2 个答案: