Question

我正在升级我继承的一些旧的反应组件（v0.10.0）以使用最新版本的react（v0.14.8）。

以下方案停止工作：

// within a react component    
onClick: function() {
    // DO SOMETHING
}

getDefaultProps: function () {
    return {
        someProp: 'prop',
        onClick: this.onClick
    }
}

这很容易解决，将代码移动到匿名函数中，如下所示：

getDefaultProps: function () {
    return {
        someProp: 'prop',
        onClick: function() { 
            //DO SOMETHING
        }
    }
}

我的问题是：为什么'this'的可见性在该级别发生了变化，重构此代码的最佳方式是什么？如果我必须/希望在那个级别使用'this'怎么办？

任何帮助表示赞赏，作为免责声明我是超级初学者！

Answer 1

The result of getDefaultProps() is shared across all instances of a component。这意味着结果不能依赖于组件的任何特定实例。它改变的原因可能是因为缓存带来的性能优势，尽管我无法肯定地说。

至于重构代码，我不确定这里是否有一颗银弹。从我的角度来看，你现在拥有的东西看起来像是反模式。道具意味着由不了解组件内部工作原理的消费者传递，因此支柱的默认值取决于内部工作情况似乎很奇怪。如果不确切知道你在做什么，我会说你最好的办法就是使用null作为道具的默认值，然后在你有权访问{{1}时检查运行时的值。上下文。

this

React upgrade：getDefaultProps中的“this”可见性

1 个答案: