本文共 954 字，大约阅读时间需要 3 分钟。
前言
最近一直在上课，公众号后台收到了不少学生和朋友的留言和提问。有关于技术的也有关于其他的，后面会整理出来统一回复和交流。留言主要内容是：希望能够推出比较综合的React-Native项目，Vue项目等等。
本系列大前端干货篇共6篇，都是基于现在公司项目开发中比较核心的功能写的Demo，有React-Native，也有Vue写的。第一篇是一个用React-Native写的购物车案例，欢迎转载，希望能帮助到更多的开发者。
一、Demo简介
(一) Demo运行平台
iOS/Android双平台
(二) Demo目构建语言
React-Native 0.44.0版本，遵循ES6+JSX语法
(三) Demo主要功能
购物车界面搭建、建模、商品的添加/删除、总价计算、购买、清空购物车等，涵盖了购物车最主要的功能，可以在此基础上进一步定制...
(四) Demo主要知识点
ES6箭头函数、对象深浅拷贝、通知实现多界面传参、数据模型驱动界面、多界面组件化...
二、Demo安装运行
(一) 下载项目源码
方式一：百度云盘下载
链接: 密码: vkx5
方式二：GitHub下载
(二) 运行项目
a）打开终端，输入：cd BGoodsBuy，进到项目目录
b）输入：npm install，下载node_modules
c）运行在iOS设备：react-native run-ios
d）运行在Android设备：react-native run-android
三、主要功能效果截图
四、项目主要结构分析
整个界面在整体上被拆分成三个组件进行复用，分别是：XZHBottomView.js、XZHWineCell.js、XZHMain.js三个文件，其中XZHMain为总集成文件，分别在index.android.js和index.ios.js中进行实例化。
购物车的主要逻辑在于商品的添加和删除、总价的计算，而且要做到全局范围同步，在本案例中主要通过了shop模型驱动了整体的页面，实现一改全改，具体代码备注都很明确，请下载查看。
