所以这是我的问题我需要一次更改多个输入 我的代码会返回并更改每个单独的输入,并根据已更改的数字按顺序对它们进行排序
renderDogAndOwners(dogs) {
if (dogs.length > 0) {
dogs.sort(Helpers.sortByArmbandNumber);
return dogs.map((dogInfo, index) => {
return (
<li key={index}>
<span style={{ width: '5%' }}>
<Input inputProps={{ type: 'text', onBlur: this.handleSave,
id: `${dogInfo.ownerDogId}` }}
statePropName='armbandNumber'
style={{ width: '40px' }}
value={this.state.armbandNumberObj
[dogInfo.ownerDogId].number.toString()}
onChange={this.handleChange} />
</span>
</li>
);
});
}
return null;
}
现在,如果其中一个输入发生变化,我就会这样做
handleSave({ target }) => {
let value = target.value ? Number(target.value) : '';
let state = { ...this.state };
let ownerDogId = target.id;
let dog = this.dogs.find((dog) => dog.ownerDogId === ownerDogId);
if (dog.armbandNumber === value) {
return;
}
dog.armbandNumber = value || 1;
dog.forceNumber = value;
state.armbandNumberObj[ownerDogId].forced = true;
if (dog.forceNumber === '') {
delete dog.forceNumber;
delete state.armbandNumberObj[ownerDogId].forced;
}
this.dogs.sort(Helpers.sortByArmbandNumber);
this.dogs = this.createArmbandNumbers(this.dogs);
//I would like to just set state here!!! only once
this.setState({ state });
//but I have to do this ):
this.armbandNumbersSetState(this.dogs);
}
这是我的问题我不希望每次改变状态都会发生变化我想立刻做到这一切有没有人有任何想法如何做到这一点
armbandNumbersSetState(dogs) {
let state = {...this.state};
dogs.forEach((dog) => {
state.armbandNumberObj[dog.ownerDogId].number = dog.armbandNumber;
if (dog.forceNumber) {
state.armbandNumberObj[dog.ownerDogId].forced = true;
}
this.setState({state});
});
}