переменная NaN в методе класса mobx (наблюдаемый - mobx)

Я пытаюсь обновить наблюдаемую переменную counter whoch и наблюдаю за значениями в компоненте, затем я нажимаю кнопку увеличения, 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
person TyForHelpDude    schedule 04.07.2017    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Я думаю, ваша проблема в том, что вам нужно держать язык за зубами, когда речь идет о том, о чем this. В App нет поля counter, и это то, на что вы в конечном итоге пытаетесь сослаться, когда пишете bind(this).

Попробуйте <button onClick={() => counter.increment()}>+</button>.

person finnss    schedule 04.07.2017