MobX+react使用小demo
第一次接触mobx,网上找了很多例子,写此主要总结一下create-react-app + mobx入门
create-react-app myreact
cd myreact
npm install
npm start
因楼主默认端口被占用,先修改端口,也为了安装其他插件,现将eject弹出,这时执行npm run eject会报错, 是因为git原因,需要执行命令:git add . git commit -m 'test'
成功后执行npm run eject, 会问你是否弹出, 因为eject弹出后将不能恢复成原来,此执行Y, 弹出后执行命令npm start
因为mobx用到修饰器, 单修饰器还只是es7的一个提案,需要安装支持修饰器的依赖
npm i --save-dev babel-plugin-transform-decorators-legacy
npm install @babel/plugin-proposal-decorators --save-dev
现在修饰器语法应该就没什么问题了 开始安装mobx
npm install mobx --save
npm install mobx-react --save
然后配饰package.json



index.js

以上为全部代码 success!
MobX+react使用小demo的更多相关文章
- React问答小demo
在学习react初期,看了一些视频和资料,react基础知识差不多学完,跟着网上的一个教程,做了一个小型的问答demo. 需求看图说: 1.点击"添加"按钮,显示问题输入表单,再次 ...
- 助你了解react的小demo
React是个啥 React 是一个用于构建用户界面的 JAVASCRIPT 库. React主要用于构建UI,很多人认为 React 是 MVC 中的 V(视图). React 起源于 Facebo ...
- 学习react,动手实现一个小demo(仿知乎问答)
学习react也有一周的时间,最近自己做了个仿知乎问答的小demo,项目源码在github上:https://github.com/yang302/reactQa 使用技术:bower+gulp+re ...
- React Native八大Demo
参考资料:http://www.cnblogs.com/shaoting/p/7148240.html 下一个项目公司也打算使用react native.大致看了下原型设计,写几个小demo先试试水. ...
- 新手 gulp+ seajs 小demo
首先,不说废话,它的介绍和作者就不在多说了,网上一百度一大堆: 我在这里只是来写写我这2天抽空对seajs的了解并爬过的坑,和实现的一个小demo(纯属为了实现,高手请绕道); 一.环境工具及安装 1 ...
- Nancy之基于Nancy.Hosting.Self的小Demo
继昨天的Nancy之基于Nancy.Hosting.Aspnet的小Demo后, 今天来做个基于Nancy.Hosting.Self的小Demo. 关于Self Hosting Nancy,官方文档的 ...
- Nancy之基于Nancy.Owin的小Demo
前面做了基于Nancy.Hosting.Aspnet和Nancy.Hosting.Self的小Demo 今天我们来做个基于Nancy.Owin的小Demo 开始之前我们来说说什么是Owin和Katan ...
- Nancy之基于Self Hosting的补充小Demo
前面把Hosting Nancy with ASP.NET.Self Hosting Nancy和Hosting Nancy with OWIN 以demo的形式简单描述了一下. 这篇是为Self H ...
- [Unity3D]做个小Demo学习Input.touches
[Unity3D]做个小Demo学习Input.touches 学不如做,下面用一个简单的Demo展示的Input.touches各项字段,有图有真相. 本项目已发布到Github,地址在(https ...
随机推荐
- fedora23没有/var/log/messages &如何禁用后台自动更新软件?
警告!! Linux是一个非常敏感的操作系统,若删除文件错误,很容易造成系统崩溃. fedora23没有/var/log/messages 不是没有messages这个文件,而是 从 fc core ...
- async/await处理异步
async函数返回一个Promise对象,可以使用then方法添加回调函数.当函数执行的时候,一旦遇到await就会先返回,等到异步操作完成,再接着执行函数体内后面的语句. 看代码: 指定多少毫秒后输 ...
- InstallShield Limited Edition for Visual Studio 使用
首先到https://info.flexerasoftware.com/IS-EVAL-InstallShield-Limited-Edition-Visual-Studio填写信息: 完成之后跳转到 ...
- Python入门(二)列表、字典、字符串、元组、集合
列表list什么是列表:Python内置的一种数据类型是列表,list是一种有序的集合,可以随时添加和删除其中的元素 创建List列表的方法 L = ['杨俊辰',‘啦啦啦’,'Tom'] empty ...
- archlinux 装完系统连接 wifi 网络
查看 IP 地址 ip a 注:没有看到 IP 地址,确认没有网络.或者也可以使用命令 ping www.baidu.com 测试是否有网络. 执行该指令: sudo systemctl start ...
- xadmin邮箱验证码 标题 EmailVerifyRecord object
[修改users-models模块] 1.如果这样不生效 def __unicode__(self): return '{0}({1})'.format(self.code, self.email) ...
- antd按需加载,配置babel-plugin-import插件,编译后报错.bezierEasingMixin()解决方案
报错如下: ./node_modules/antd/lib/button/style/index.less (./node_modules/css-loader??ref--6-oneOf-7-1!. ...
- Azure中block和Page的比较 Azure: Did You Know? Block vs Page Blobs
Azure storage service supports two types of blobs (blob, or BLOB, stand for Binary Large OBject, i.e ...
- Java使用RSA加密解密签名及校验
RSA加密解密类: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 ...
- ES5 & ES6 基础
一.什么是ES5 附上一览表 (5.1中文 (2011.6)): http://lzw.me/pages/ecmascript/ (5.1英文PDF):http://www.ecma-internat ...