javascript - 让 jsx 编译器忽略引用其他 API 的行

Question

我正在使用 React.js 在 chrome 内容脚本中制作组件。

当本地存储中的数据发生变化时，react 组件应该重新渲染。

readUserInfo : function() {
  chrome.storage.onChanged.addListener(function(object changes, string areaName) {
    this.setState({userInfo:changes["userInfo"].newValue});
});

带有挂载功能

componentDidMount: function() {
  this.readUserInfo();
}

当然，jsx 编译器会抱怨 chrome API 调用。我怎样才能让 jsx 编译器忽略这一行，即将它保留为 vanilla js？

Answer 1

试试这个：

componentDidMount: function() {
  chrome.storage.onChanged.addListener(this.onChromeStorageChange)
},
onChromeStorageChange: function(changes, areaName) {
   this.setState({ userInfo:changes["userInfo"].newValue })
}

我使用了 React 的自动绑定并删除了您拥有的无效参数表达式（可能从文档中复制/粘贴）。不要忘记在组件卸载时移除监听器。