无法使用道具更新状态

Question

找到这个：https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html#new-lifecycle-getderivedstatefromprops

我很确定这就是我要找的。

我正在尝试在 prop 更改时更新我的状态，以便在我的 prop 更改时更新视图。

（为什么我所描述的听起来像火箭科学？基本上用尼安德特人的话说，阵列转到视图）

我的阵列来自订阅（不不是 html.get，它只是一个穷人的商店）。

我订阅了 parent 并将其作为道具传递，因为 apparent 将它放在同一组件中不会更新。

我的问题是 getDerivedStateFromProps() 在初始化时触发但不在更新时触发（由于某种原因，初始化值不是从 parent 传递的值）并且在那之后不再触发，当我在 parent.

中进行最终正确 console.logs 的点击另一方面，

componentDidUpdate() 根本不会触发。

我有这个：

interface Props {
    mything: string
}

interface State {
    mything: string
}

class Component extends React.Component<Props, State> {

  constructor(props: any) {
     super(props);
     this.state = { mything: ''} 
  }

  static getDerivedStateFromProps(props: Props, state: State) {
    console.log('hi', props);
    return {tanks: props.mything}
  }

  componentDidUpdate(prevProps: Props, prevState: State){
    console.log('ho');
    if(prevProps.mything !== this.props.mything){
        this.setState(state => ({
            mything: this.props.mything
        }));
    }
  }

  componentWillReceiveProps(nextProps: Props, nextContext: Props): void {
    console.log('d')
    this.setState(state => ({
        mything: this.props.mything
    }));
  }

  render() {
      return(
         {this.state.mything.map((thing: thingType, index: number) => {
            return (
               <div key={index} />
               </div>
                   )
         })}
      )
  }

props 已正确传递且可读。我可以成功地对其进行迭代，但是对于 apparent 的更新不是我想做的，我想将它复制到 state 并对其进行迭代。

因此为什么在上面的代码中我指的是状态的神话而不是道具的神话。

我对使用 componentDidUpdate() 或 getDerivedStateFromProps() 不感兴趣，我只是认为它们会是我的解决方案，正如您在上面看到的，我尝试了 componentWillReceiveProps() 但没有成功，而且我了解到它已被弃用。有 UNSAFE_componentWillReceiveProps() 但光是这个名字就足以让我明白我会逆流而上。

但就目前而言，我找不到将道具复制到状态的方法。（当然，它会在道具更换时发生）。

Answer 1

我发现在父级中声明状态并将状态（而不是全局变量）传递给子级足以让子级使用 props 始终更新，不需要在子级中使用任何方法。

这个东西不是很明显，应该在文档中解释b̶e̶t̶t̶e̶r̶。

无法使用道具更新状态

can't update state with props

reactjs

typescript

react-props

react-component

react-state