相关疑难解决方法(0)

Reactjs - 使用子组件中的setState从props设置State

我有以下类根据排序下拉列表呈现用户.如果我选择"按字母顺序",则按字母顺序列出用户,当我选择"组"时,将按组顺序列出.

render(){
    return(
        const {members, sort} = this.state
        { sort === "alphabetical" && <SortByAlphabet members={members} /> }
        { sort === "group" && <SortByGroup members={members}/> }
    )
)
Run Code Online (Sandbox Code Playgroud)

<SortByAlphabet />组件中,我在componentWillReceiveProps()函数中从props.members设置组件状态对象.

componentWillReceiveProps = props => {
    this.setState({ members : props.members });
}
Run Code Online (Sandbox Code Playgroud)

当我选择"组"排序时,<SortByAlphabet />组件将被卸载并<SortByGroup />挂载在DOM中.再次当我切换回"按字母顺序"排序时,在<SortByAlphabet />组件中优先设置的状态变量(成员)变为NULL,因为组件已从DOM中删除.

componentWillReceiveProps函数不会触发第二次重新渲染<SortByAlphabet />b'coz时道具没有改变.但我想更新状态变量,就像我第一次在componentWillReceiveProps功能中做的那样.

怎么做?

javascript reactjs

6
推荐指数
2
解决办法
4487
查看次数

标签 统计

javascript ×1

reactjs ×1