React.js 组件：用户定义的属性。我做对了吗？

Question

我刚开始学习React，想知道如何存储一些任意变量。让我们举个例子：

var StaffRow = React.createClass({
    doubleClickTimeout: null,
    waitingForDoubleClick: false,
    doubleClick: function(e){
        console.log('doubleClick');
    },
    singleClick: function(e){
        console.log('singleClick');
    },

    clickHandler: function(e){
        if(this.waitingForDoubleClick)
        {
            this.waitingForDoubleClick = false;
            clearTimeout(this.doubleClickTimeout);
            this.doubleClick(e);
        } else {
            this.waitingForDoubleClick = true;
            this.doubleClickTimeout = setTimeout(function() {
                this.waitingForDoubleClick = false;
                this.singleClick(e);
            }.bind(this), 300);
        }
    },

    render: function() {
        var name = "Some Name";
        return (
            <li onClick={this.clickHandler} >
                <span>{name}</span>
            </li>
        );
    }
});

我正在实施 click/doubleclick 处理程序。这工作得很好，但我想知道，如果这是存储一些随机属性（doubleClickTimeout 和 waitingForDoubleClick）的正确方法，或者是否有一些我不知道的污染 React 组件实例的注意事项？谢谢

Answer 1

虽然不需要，但我会删除第 2 行和第 3 行：

doubleClickTimeout: null,
waitingForDoubleClick: false,

并在 componentWillMount 中设置它们。原因是如果这些是 object/arrays，它们将被所有使用上面的实例共享，而 componentWillMount 是一个函数，所以它们将是干净的引用。

componentWillMount: function(){
    this.doubleClickTimeout = null;
    this.waitingForDoubleClick = false;
}

经验法则是如果它影响渲染，它必须在状态或道具中。否则一个实例属性是要走的路。

React.js 组件：用户定义的属性。我做对了吗？

React.js component: user defined properties. Am i doing it right?

javascript

reactjs