mobx가 반응보기를 업데이트하지 않음

Question

반응에서 간단한 카운터를 만들기 위해 Mobx를 사용하려고합니다. 클래스의 값을 업데이트하는 것을 볼 수 있지만 업데이트 된 값은 반응보기에서 업데이트되지 않습니다. 여기

난 그냥 JSFiddle에 코드를 시도하고 문제없이 실행하는 것

import {observable} from 'mobx'; 
import {observer} from 'mobx-react'; 
import React, {Component} from 'react'; 
import ReactDOM from 'react-dom'; 

class CounterStore { 
    @observable counter; 

    constructor(){ 
    this.counter = 0; 
    } 

    increase(){ 
    this.counter++; 
    } 

    decrease(){ 
    this.counter--; 
    } 
} 

@observer 
class Counter extends Component { 
    render(){ 
    const counter = this.props.counter; 
    return(
     <div style={{display: 'flex'}}> 
     <button onClick={counter.increase.bind(counter)}>+</button> 
     <p style={{color: 'black', marginRight: '1rem', marginLeft: '1rem'}}>{counter.counter}</p> 
     <button onClick={counter.decrease.bind(counter)}>-</button> 
     </div> 
    ); 
    } 
} 

const store = new CounterStore(); 

ReactDOM.render(
    <Counter counter={store} />, 
    document.getElementById('app') 
); 

Answer 1

내 코드?

http://jsbin.com/bocabefuji/1/edit?html,js,console,output