angularjs - react 一个状态变量依赖于多个其他状态变量

Question

我来自有 Angular 的世界。而且我对 react 还很陌生。

我遇到的一个问题是:

在 Angular 中，我们有 $watch 来监视一个作用域变量以更改和更新其他变量。比如观察B,C,D，B,C,D的变化会影响变量A

在 react 中，我正在尝试做同样的事情。但是，我正在调用 setState(B,callbackB) 来更新 A。A 的 setState 对渲染有影响

对于变量 B 来说，这样做似乎正确。但是，更新 A 将在下一个渲染周期中发生。而且 this.forceUpdate() 似乎不起作用。

我是不是做错了什么？

谢谢

Answer 1

一个示例将有助于阐明您的情况，但根据“更新 A”的含义，您可以将其移动到渲染函数中。例如

class Component extends React.Component {
  handleUpdate(B) {
    this.setState({B})
  }

  computeAFromB(B) {
    ...
    return A
  }

  render() {
    const A = this.computeAFromB(this.state.B)

    return <div>{A}</div>
  }
}

从 Angular 过渡到 React 时，请务必牢记范围 !== 状态。这可能会有所帮助:https://facebook.github.io/react/docs/thinking-in-react.html