在reactjs中记住实例变量的最佳方法是什么答案

【问题标题】：What's the best way to remember instance variables in reactjs在reactjs中记住实例变量的最佳方法是什么
【发布时间】：2014-11-18 09:44:57
【问题描述】：

我在react 中有一个基本类，当我单击时会绘制一个矩形

Conq.R.Canvas = React.createClass

  displayName: 'Canvas'

  componentDidMount: ->
    @setState $(@getDOMNode()).offset()

  onMouseDown: (e) ->

    canvas = @getDOMNode()
    context = canvas.getContext('2d')
    context.fillRect e.clientX - @state.left, e.clientY - @state.top, 10, 10

  render: ->

    <canvas onMouseDown={@onMouseDown}></canvas>

它工作正常。将offset 之类的东西存储在状态中是典型的，还是应该将其设置为this 或将其放入props？约定是什么？为什么？

不要因为存储它而敲我，如果它没有被偏移，它可能是我存储的其他值。我的基本问题是，我应该将仅在实例中使用的局部变量放在哪里，为什么？

【问题讨论】：

标签： reactjs

【解决方案1】：

如果改变它会导致以下任一情况，它应该是 state/props：

渲染以输出不同的结果
componentWillUpdate 行为不同
componentDidUpdate 行为不同

在这种情况下this.top 会很好。

【讨论】：

作为“渲染以输出不同结果”的子项目符号，我将添加“由子组件依赖”。否则竖起大拇指。
那将是不同的结果，因为您正在渲染具有不同道具的子组件。 <a href={this.state.url} /> 和 <foo bar={this.state.baz} /> 是状态变化时的不同结果。
不确定我是否关注？ <a> 也是一个组件，它是一个 React.DOM.a。
我想我明白你的意思了。为了清楚起见，我提到将它添加为子项目符号，尽管如果它导致后代呈现不同的方式，它的最终结果可能最终与第一个项目符号匹配。为了封装的利益，父组件不应该“知道”改变它传递给其后代的值的效果，所以我认为值得一提。