如何解决我如何才能在包含对象的React useState中仅更改一个值,并为其余对象分配一个不同的值?
我的状态如下:
const [clickColumn,setClickColumn] = useState({
name: 0,tasks: 0,partner: 0,riskFactor: 0,legalForm: 0,foundationYear: 0
})
现在,例如,我只想将name设置为2,其余的设置为1。但是我不想这样写:setClickColumn({ name: 2,tasks: 1,riskFactor: 1,partner: 1,legalForm: 1,foundationYear: 1 });
如何使其更短?
解决方法
缩短它并不一定会使它更简单,但是您可以执行以下操作:
const obj = {
name: 0,tasks: 0,partner: 0,riskFactor: 0,legalForm: 0,foundationYear: 0
};
const entries = Object.entries(obj).map(([key,value]) => key === 'name' ? [key,2] : [key,1]);
const result = Object.fromEntries(entries);
console.log(result);
,
您可以使用传播运算符使其变得简单:
setClickColumn({ ...clickColumn,name: 2 });
它将散布现有对象clickColumn并添加名称:2,以覆盖默认值。 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax
,您可以轻松创建一个函数,该函数将通过解析对象并提供正确的值来为您重置状态:
const getResetClickColumn = (clickColumn) => {
Object.keys(clickColumn).forEach(key => {
const value = (key === 'name' ? 2 : 1);
clickColumn[key] = value;
})
return clickColumn;
}
const reset = getResetClickColumn({
name: 0,foundationYear: 0
})
console.log(reset)
,
除了@MorKadosh的答案:
setClickColumn(Object.fromEntries(Object.entries(clickColumn)
.map(([key,value]) => [key,key === 'name' ? 2 : 1])))
,
您可以简单地创建一个临时变量
let tmpColumn = clickColumn;
tmpColumn.name = 2;
// other changes
setClickColumn(tmpColumn);
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。