父组件state改变，子组件未重新渲染

• 父组件state中有数组

state: any = {
  folders: [],
  files: []
};

• 父组件的方法，对文件进行排序

sort = () => {
  const newFolders = sortWay(this.state.folders);
  const newFiles = sortWay(this.state.files);
  this.setState({
    folders: newFolders,
    files: newFiles
  })
}

• 传递给子组件

return (
  <Son sort={this.sort} folders={this.state.folders} files={this.state.files} />
)

• 子组件调用该排序方法，父组件state改变，但子组件不会重新渲染。

解决

• 使用扩展运算符

return (
  <Son sort={this.sort} folders={[...this.state.folders]} files={[...this.state.files]} />
)

• React 之 state 数据改变页面不更新未重新渲染的 7 种情况 及 解决办法