i trying inject store react component getting following error:
undefined not function (evaluating 'decorator(target,property,desc)')
in app.js have:
import react, { component } 'react'; import poolcomponent './app/components/poolcomponent'; import measurementsstore './app/stores/measurementsstore'; export default class poolapp extends component { render() { return ( <poolcomponent store="measurementsstore"/> ); }
}
in poolcomponent.js
import react, { component } 'react'; import { observer, inject } 'mobx-react'; import { appregistry, text, view, textinput , picker, button} 'react-native'; @observer export default class poolcomponent extends component { saveitems() { console.log('pressed save'); } render() { const store = this.props.store; return ( <view> <text>selecteer pool</text> <picker> <picker.item label="big" value="big"/> <picker.item label="small" value="small"/> </picker> <text>ph</text> <textinput/> <text>totaal chloor</text> <textinput/> <text>vrij chloor</text> <textinput/> <button title="learn more" color="#841584" accessibilitylabel="opslaan" onpress={this.saveitems} /> </view> ); } }
and in measurementsstore.js have
import {observable, action, computed} 'mobx-react'; export default class measurementsstore { @observable phvalue = 0; @observable freechlorine = 0; @observable totalchlorine = 0; @observable totalalkalinity = 0; @action data(data: object) { if (data.phvalue) { this.phvalue = data.phvalue; } if (data.freechlorine) { this.freechlorine = data.freechlorine; } if (data.totalchlorine) { this.totalchlorine = data.totalchlorine; } if (data.totalalkalinity) { this.totalalkalinity = data.totalalkalinity; } } }
you don't need inject in case. passing store directly poolcomponent
, there no need it. need change few things however:
pass actual store, not store name string, in app.js
:
import react, { component } 'react'; import poolcomponent './app/components/poolcomponent'; import measurementsstore './app/stores/measurementsstore'; export default class poolapp extends component { render() { return ( <poolcomponent store={measurementsstore}/> ); }
import mobx
, export instance of measurementsstore
in measurementsstore.js
:
import {observable, action, computed} 'mobx'; class measurementsstore { @observable phvalue = 0; @observable freechlorine = 0; @observable totalchlorine = 0; @observable totalalkalinity = 0; @action data(data: object) { if (data.phvalue) { this.phvalue = data.phvalue; } if (data.freechlorine) { this.freechlorine = data.freechlorine; } if (data.totalchlorine) { this.totalchlorine = data.totalchlorine; } if (data.totalalkalinity) { this.totalalkalinity = data.totalalkalinity; } } } const measurementsstore = new measurementsstore(); export default measurementsstore;
Comments
Post a Comment