mobx 类的方法中的变量是 NaN (observable - mobx)答案

【问题标题】：variable is NaN in method of mobx class(observable - mobx)mobx 类的方法中的变量是 NaN (observable - mobx)
【发布时间】：2017-12-08 03:43:17
【问题描述】：

我正在尝试更新可观察变量的计数器，并观察组件中的值，当我单击增量按钮时，this.counter 始终为 NaN，无法理解为什么。组件：

@observer
class App extends Component {
  constructor(props){
    super(props)
  }
  render() {
    const counter = this.props.appState;
    return (
        <div className={styles.description}>
          <button onClick={counter.increment.bind(this)}>+</button>

Mobx 类；

class AppState{
    @observable counter=0

   increment(){
       debugger //its null..
        this.counter++;
    }
}
export default AppState

mainjs:

import AppState from './AppState'
...
var appState = new AppState

ReactDOM.render(
  <App appState={appState}/>,
  document.getElementById('root')
);

我该如何解决？

【问题讨论】：

标签： reactjs mobx mobx-react

【解决方案1】：

我认为您的问题是，当谈到 this 所指的内容时，您需要保持敏锐的言辞。 App 中没有 counter 字段，这就是您在编写 bind(this) 时最终尝试引用的内容。

试试<button onClick={() => counter.increment()}>+</button>。

【讨论】：