react如何修改对象中的值
修改 React 对象中的值
在 React 中修改对象中的值需要遵循不可变性原则，即不能直接修改原对象，而是创建新对象。以下是几种常见方法：
使用展开运算符
通过展开运算符复制原对象，并覆盖需要修改的属性：
const [state, setState] = useState({ name: 'John', age: 25 });
const updateAge = () => {
setState({
...state,
age: 30
});
};使用 Object.assign
Object.assign 也可以用于创建新对象：
const updateAge = () => {
setState(Object.assign({}, state, { age: 30 }));
};嵌套对象修改
对于嵌套对象，需要逐层展开：
const [user, setUser] = useState({
name: 'John',
profile: {
age: 25,
job: 'developer'
}
});
const updateProfile = () => {
setUser({
...user,
profile: {
...user.profile,
age: 30
}
});
};使用 Immer 库
Immer 可以简化不可变更新：
import produce from 'immer';
const updateAge = () => {
setUser(produce(user, draft => {
draft.profile.age = 30;
}));
};数组中的对象修改
修改数组中的特定对象：
const [items, setItems] = useState([
{ id: 1, value: 'A' },
{ id: 2, value: 'B' }
]);
const updateItem = (id, newValue) => {
setItems(items.map(item =>
item.id === id ? { ...item, value: newValue } : item
));
};这些方法都遵循 React 的不可变更新原则，确保组件能正确检测到状态变化并重新渲染。
