在最近这半年的工作中接触和使用了react native,先不谈react native本身的存在的一些问题,只谈谈在工作中遇到的一些问题。
在前期的react native项目开发过程中,对一些功能,静态文件,通用组件的文件划分,包括一些常用的工具函数,接口请求函数,分辨率适配等文件的编写,安装react常用的划分体系进行开发工作。在项目的具体开发过程中,发现接口的文件请求过于分散,接口查找等都不是很方便,中间的数据管理也都不是很方便,经常需要在多个组件件进行状态的传递,导致了容易出现一些问题。因此,在项目中引入了dvajs作为项目的数据流管理工具(不要问我为什么不直接用redux,干嘛要用二次封装的dva。这么选择时因为根据团队的使用情况与开发周期来选择的。在公司之前的web项目中,基本都是选择的react+dva+antd来开发的,在使用react-native对一些之前的web项目进行迭代,为了在追求开发效率,团队的技术能力,产品的可维护性之间保持一个平衡,才选择了同学都比较熟悉的dva,复制一时爽,一直复制一直爽)。
在引入dva的过程中,遇到了几个文件,在这里说明一下。
1.需要引入dva相关的什么文件,需要安装那些包?
2.使用过程中遇到了什么问题?
问题1:只需要安装dva-core和react-redux两个相关的依赖包就可以。版本信息:"dva-core": "^1.4.0", "react-redux": "^6.0.1"。
问题2: 当你安装了上面的两个依赖后,编写servers文件和modal文件后,在项目中引用会发现会有一个报错,对修饰符@不支持
应该怎么解决修饰符不支持的问题呢?
安装依赖
{ "name": "app", "version": "0.0.1", "private": true, "scripts": { "start": "node node_modules/react-native/local-cli/cli.js start", "test": "jest" }, "dependencies": { "@babel/plugin-transform-flow-strip-types": "^7.3.4", "babel-plugin-transform-flow-strip-types": "^6.22.0", "dva-core": "^1.4.0", "prop-types": "^15.6.2", "react": "16.6.3", "react-native": "0.57.8", "react-navigation": "^2.18.2", "react-redux": "^6.0.1" }, "devDependencies": { "@babel/plugin-proposal-decorators": "^7.4.0", "babel-core": "^7.0.0-bridge.0", "babel-jest": "23.6.0", "babel-plugin-transform-decorators-legacy": "^1.3.5", "jest": "23.6.0", "metro-react-native-babel-preset": "0.51.1", "react-test-renderer": "16.6.3" }, "jest": { "preset": "react-native" }, "babel": { "presets": [ "module:metro-react-native-babel-preset" ], "plugins": [ [ "@babel/plugin-transform-flow-strip-types" ], [ "@babel/plugin-proposal-decorators", { "legacy": true } ], [ "@babel/plugin-proposal-class-properties", { "loose": true } ] ] } }
如果你对项目文件夹下面有.babelrc文件,需要在该文件下填入下面内容
{ "presets": ["module:metro-react-native-babel-preset"], "plugins": [ ["@babel/plugin-transform-flow-strip-types"], ["@babel/plugin-proposal-decorators", { "legacy": true }], ["@babel/plugin-proposal-class-properties", { "loose" : true }], ] }
如果没有.babelrc文件夹,就在项目根目录下面新建babel.config.js文件夹,输入与上面同样的内容即可。