Select field value not changing on setState in onChange

huangapple go评论56阅读模式
英文:

Select field value not changing on setState in onChange

问题

我的选择值来自 data.RowCount.Value。在下一次渲染之前更改该值不会反映出来。

const [data, setData] = ({RowCount: {"Value": 5}})

...
<TextField 
    select 
    value={data.RowCount.Value} 
    onChange={(e) => {
        setData((prev) => {
            prev.RowCount.Value = e.target.value; 
            return prev;
        });
    }}>
    <MenuItem>Item</MenuItem>
</TextField>
英文:

My Select value is gotten from data.RowCount.Value. Changing the value is not reflected until the next render.

const [data, setData] = ({RowCount: {&quot;Value&quot;: 5}})

...
&lt;TextField 
    select 
    value={data.RowCount.Value} 
    onChange={(e) =&gt; {
        setData((prev) =&gt; {
            prev.RowCount.Value = e.target.value; 
            return prev;
        });
    }}&gt;
    &lt;MenuItem&gt;Item&lt;/MenuItem&gt;
&lt;/TextField&gt;

答案1

得分: 1

您正在更改状态,不要更改状态

更新嵌套对象

setData((prev) =&gt; ({
   ...prev
   RowCount: {
      ...prev.RowCount,
      value: e.target.value
   }
}))
英文:

You're mutating state, don't mutate state

Update a nested object

        setData((prev) =&gt; ({
           ...prev
           RowCount: {
              ...prev.RowCount,
              value: e.target.value
           }
        }))

答案2

得分: 0

你需要更新代码如下:

setData({RowCount: {"value": e.target.value}}) 或
setData(prev => {return {...prev, RowCount: {"value": e.target.value}}})

英文:

you need to update code like this

    setData({RowCount: {&quot;value&quot;: e.target.value}}) or
    setData(prev =&gt; {return {...prev, RowCount: {&quot;value&quot;: e.target.value}}})

huangapple
  • 本文由 发表于 2023年5月10日 22:44:21
  • 转载请务必保留本文链接:https://go.coder-hub.com/76219790.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定