一、 首先配置环境 当然是node 下用npm
然后创建项目
在电脑上启动的安卓虚拟机 不能摇一摇,所以还需要在 cmd 里输入

在笔记本下启动的虚拟机会比较卡可以设置如下,会稍微好点
二、需要实现的界面和功能如下
新建一个AppNavigator.js 文件 用于首页和详情页的跳转
index.android.js 首先展示首页
reactjs 写样式和传统的css 有一定的区别,驼峰和没有简写如(margin: 0 auto) 是没有的,同时安卓机下是不能显示出阴影的
首页中的 卡片布局如下
卡片滑动swipe 效果
首页抽屉效果
以上所用插件我都有改动 符合demo的需求····
通过这次的demo学习对react 有进一步的认识与体会,
组件的生命周期
componentWillReceiveProps(nextProps){} 接收新的数据
shouldComponentUpdate(nextProps, nextState){ return boo} 必须有返回值, 返回 false componentWillUpdate()不会被调用 render()也再不执行 ,这样根据需要可以禁止页面的更新。
react native事件捕获
onStartShouldSetPanResponderCapture, onMoveShouldSetPanResponderCapture连个方法都有返回值, 返回true 时,事件就不再传递,被当前组件劫持并调用当前组件的onResponderStart或者onResponderRlase等
数据请求利用 facth 比传统ajax 更简洁 当然属于es6 的
state 更新 用setState 当然也可以用 如
forceUpdate就是重新render。有变量不在state上,缺又想更新state,刷新render;或者state里的某个变量层次太深,更新的时候没有自动触发render。这些时候都可以手动调用forceUpdate自动触发render。
有需要合作的,可以加个好友