untitled

untitled.carbide.md

undefined

This Gist was automatically created by Carbide, a free online programming environment.

You can view a live, interactive version of this Gist here.

App.js

import React from 'react';
import { observer } from 'mobx-react';
import { test } from './stores';

const inc = () => test.val++;
const dec = () => test.val--;
const reset = () => test.reset();



const App = observer(() => (
    <div>
    	<h1>Test Val {test.val}</h1>
        <button onClick={inc}>+</button>
        <button onClick={dec}>-</button>
        <button onClick={reset}>Reset</button>

    </div>
));

export default App;

index.js

import React from 'react';
import { render } from 'react-dom';
import DevTools from 'mobx-react-devtools';

import App from './App'

render((
    <div>
        <DevTools />
    	<App />
    </div>
	),
	document.getElementById('root')
);

stores.js

import { observable } from 'mobx';

export const test = observable({
	val: 0,
	reset() {
        this.val = 0;
    }
});