排序的reactjs常量状态
排序的reactjs常量状态
提问于 2019-05-23 07:45:49
我正在进行数组排序。为此，我在状态中存储了两个变量，一个用于更改数组，第二个用于默认的数组，以便我可以返回原始数组。然而，当改变时，两个数组都会改变。我该如何解决这个问题呢？有没有可能设置某种常量？有什么建议？我需要this.state.messagesDefault是常量。
class Messages extends Component {
state = {
messages: [],
messagesDefault: []
};
componentDidMount() {
this.props.getMessages();
}
componentWillReceiveProps(nextProps) {
console.log(333)
this.setState({
messages: nextProps.messages.messages,
messagesDefault: nextProps.messages.messages
})
}
onSort(type) {
// when i call this function both arrays are changing, but i need this.state.messagesDefault to stay by default
let messagesDefault = this.state.messagesDefault;
if (type === 'all') {
} else if (type === 'new') {
messagesDefault.sort((a, b) => (a.notReaded) ? -1 : (a.lastMessage === b.lastMessage) ? -1 : 1);
} else if (type === 'deal') {
messagesDefault.sort((a, b) => (a.lastMessage === b.lastMessage) ? 1 : (a.accpet && a.accpet.author && a.accpet.executor) ? -1 : 1);
}
// console.log(messagesDefault)
this.setState({messages: messagesDefault})
}
render() {
console.log(this.state.messages)
return (
<div>
</div>
)
}
}回答 1
Stack Overflow用户
回答已采纳
发布于 2019-05-23 07:54:23
Array.prototype.sort更改数组引用，从而更改实际的数组内容。你需要先复制一份。
const messagesDefault = [3,4,5,6,7, 1,8];
const messages = [...messagesDefault].sort();
console.log(messagesDefault);
console.log(messages);
如果您的数组包含对象，并且您想要更改更新后的数组的对象，但又不想更改第一个数组中的对象，那么您还需要复制这些对象，因为对象是引用。
let messagesDefault = [ { title: 'Hello' }, { title: 'World' }];
let messages = [...messagesDefault].sort((a, b) => b - a);
messages[0].title = 123;
console.log(messagesDefault);
console.log(messages);
messagesDefault = [ { title: 'Hello' }, { title: 'World' }];
messages = messagesDefault.map(obj => ({...obj})).sort((a, b) => b - a);
messages[0].title = 123;
console.log(messagesDefault);
console.log(messages);
// If objects are nested, you need to make a deep copy
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/56266343
复制相关文章
相似问题