从旧的外部Javascript更改React组件的状态

Change state of React component from old external Javascript?

本文关键字:React 组件 更改 状态 Javascript 外部      更新时间:2023-09-26

如何从旧的遗留jQuery汤更改React组件的状态密码

我有一个这样的组件:

var AComponent = React.createClass({
  getInitialState: function() {
    return { ids: [] }
  },
  render: function() {
    ...
  },
  onButtonClick: function() {
    ids.splice(…); // remove the last id
  }
});

当旧的jQuery汤代码中发生特殊情况时,我希望向CCD_ 1推送id。我该怎么做?

一个"显而易见"的解决方案是反模式;在这里:

var componentInstance = AComtonent({});
React.renderComponent(componentInstance, document.getElementById(...));
// Somewhere else, in the jQuery soup. Something special happens:
componentIntance.state.ids.push(1234);
componentIntance.setState(componentInstance.state);

根据这封来自Facebook的电子邮件,这是一个反模式开发商因为他写道CCD_ 2可能会被React破坏。

我会使组件成为无状态的。将ids数组存储在组件外部,并将其作为具有修改数组的函数的道具传递。参见JSFiddle上的示例:http://jsfiddle.net/ohvco4o2/5/