小编HaK*_*lan的帖子

在 Nextjs 中使用 React.useState 获取 <select> 元素的值

我在 Nextjs 中使用 React 的 useState 函数时遇到了问题。

我有一个元素,它本身有几个元素。现在,如果我选择 e useState 应该使用所选值设置一个变量。

const [value, setValue] = useState('')

...

function logValue() {
  console.log(value)
}

return (
<div>
  <select onChange={(e) => {setValue(e.target.value)}>
    <option value="a">a</option>
    <option selected value="b">b</option>
    <option value="c">c</option>
    <option value="d">d</option>
  </select>

  <button onClick={logValue}>submit</button>
</div>
)
Run Code Online (Sandbox Code Playgroud)

我现在的问题是,第一次在选择字段中进行更改时,setValue设置了更改之前的值。

当我加载页面并将所选内容更改为“a”时,logValue不打印任何内容。然后我将值更改为“d”,logValue打印“a”。然后我将值更改为“c”,logValue打印“b”。ETC...

我怎样才能做到这一点,当我将选择字段更改为“a ”时logValue打印“a”?

html javascript reactjs next.js

1
推荐指数
1
解决办法
2万
查看次数

标签 统计

html ×1

javascript ×1

next.js ×1

reactjs ×1