react-Mobx基本使用

十分钟交互式的 MobX + React 教程

mobx 的核心理念是 简单、可扩展的状态管理库。比redux和react-redux方便许多

先create-react-app 构建一个项目

1.装包

1.1安装mobx mobx-react

  npm install  mobx mobx-react -S

1.2安装装饰器装包搭配依赖去解析(可选),装饰器作用>代码更简洁

  npm i --save-dev babel-plugin-transform-decorators-legacy

1.3装完依赖,然后json 文件中配置启用,现在采用的是babel7所以要这样配置,也可以单独在.babelrc文件中配置。2者不能冲突，选其一

 "babel": {
    "presets": [
      "@babel/preset-env",
      "react-app"
    ],
    "plugins": [
      ["@babel/plugin-proposal-decorators", {
        "legacy": true
      }],
      ["@babel/plugin-proposal-class-properties", {
        "loose": true
      }]
    ]
  },

2.项目应用

2.1一般先在src创建个store文件夹(定义状态和创