reactjs - 这不是升级时的功能错误

Question

我实际上正在更新 https://github.com/ezequiel/react-typeahead-component 这个组件以兼容 react >= 0.14 但是在更改方法时我遇到了一个错误：

Exchange this.getDOMnode 因为它被this.findDOMnode 弃用，所以会出现错误：Uncaught TypeError: this.findDOMNode is not a function

所以我尝试了很多关于 React 没有在 0.14 中自动绑定 this 到几个函数的问题。但这并没有真正帮助我。

module.exports = React.createClass({
  displayName: 'Aria Status',

  propTypes: process.env.NODE_ENV === 'production' ? {} : {
    message: React.PropTypes.string
  },

  componentDidMount: function() {
    var _this = this;

    _this.setTextContent(_this.props.message).bind(this);
  },

  componentDidUpdate: function() {
    var _this = this;

    _this.setTextContent(_this.props.message).bind(this);
  },

  render: function() {
    return (
      React.createElement("span", {
        role: "status",
        "aria-live": "polite",
        style: {
          left: '-9999px',
          position: 'absolute'
        }
      })
    );
  },

  setTextContent: function(textContent) {
    this.findDOMNode().textContent = textContent || '';
  }
});

也许有人可以指点我前进的方向！

Answer 1

在 React v 0.14 findDOMNode 已弃用，您可以尝试使用 refs，像这样

setTextContent: function(textContent) {
  this.refs.element.textContent = textContent || '';
}

或使用ReactDOM.findDOMNode

setTextContent: function(textContent) {
  ReactDOM.findDOMNode(this).textContent =  textContent || '';
}

Example