mobx模板用法

全局的存储store

import {observable, action} from 'mobx';

class Store {
  	@observable num;
    construction(){
      this.num = 0
    }
  	timer= observable({
  		tile:1,
      visible: false,//用户信息的模态框的控制
  	})

  	@action plus(){
      console.log(this.num)
  		console.log("我是加法");
    	this.timer.tile ++;
  	}

  	@action minus(){
  		console.log("我是减法");
    	this.timer.tile --;
  	}
}

export default Store;

使用store

import React, { Component } from 'react'

import {observer,inject} from 'mobx-react'; 
@inject("store") @observer
export default class Mobx extends Component{
  render() {
    return <div>
        <div>{this.props.store.timer.tile}</div>
        <button onClick={()=>{this.props.store.plus()}}>加1</button>
        <button onClick={()=>{this.props.store.minus()}}>减1</button>
    </div>
  }
}

从某一段程序中扒拉下来的。

没有具体运行过,因为要回家了,没时间。。

mobx模板用法mobx模板用法 newway007 发布了105 篇原创文章 · 获赞 2 · 访问量 1551 私信 关注
上一篇:react mobx状态管理


下一篇:第一次使用 mobx 感觉一脸懵逼( 以下为我抄袭别人的写法 照葫芦画瓢 )