目的:
回顾时知道自己今天做了什么,以便更好地梳理后记住知识点
待解决的问题
内容显示隐藏不影响布局?
在login时就已经执行listScene的内容了,why?
rn的样式到底怎么看?虽然看起来就是选择MDPI@1,但是为什么?
rn样式狂虐,rn组件长什么样,有设么用都不懂
rn内容显示隐藏
{condition(jsx)}
react navigation - Configuring the header bar by:
static navigationOptions = {
header:null
};
rn 为请求统一加上请求头token
方案
1.引入redux :有点猛,好大一框架
2.自己写全局单例存储配合set/get,类似小型redux:使用闭包内存泄漏方式似乎是不可行的,因为不同地方import都是重新执行一遍。所以必须挂载到global上了。
关于es6 import:
遇到import foo from 'xxx'语句的时候就开始执行被import文件的内容,
执行完毕后foo存储的是一个内存地址(如果复杂对象)
调研抽屉滑侧菜单:手写与三方组件:
手写没必要,一般使用第三方
npm install react-native-side-menu --save
好文链接:https://segmentfault.com/a/1190000015870219
代码的console.log出现在mac terminal of npm上!
(出现在起服务的服务器上,而不是模拟器的控制台,说明了什么?)
(node xxx.js:跑node脚本里的console.log会出现在同样的地方)
rn中吸顶和吸底
定死高度+中间层flex:1
ios顶部条的解决方案:
1、设置20的空余(margin/padding)或
2、引入statusBar(in react-native),<StatusBar hidden={true}/>
rn中引入并使用svg
(参考源https://blog.csdn.net/Crazy_SunShine/article/details/80906624)
=>跑起node脚本 ($ node xxx.js)
知识点:__dirname
总是指向被执行 js 文件的绝对路径
本次跑了一个网上的脚本,把svg转成js,其中语句const svgDir = path.resolve(__dirname, './svgs');
__dirname经打印后显示为/Users/dianyilan/Desktop/nodeScript
路径join后识别到SVGs的文件夹(顺便说明了fs.readFile对路径名大小写不敏感),成功生成了js
=>写svg component组件,import SvgUri from 'react-native-svg-uri'; 因此需要安装该包
=>查询react-native-svg-uri 官方指南
npm install react-native-svg-uri --save
link react-native link react-native-svg # not react-native-svg-uri !!!
但是expo guide里有说expo本身通过react-native-svg实现svg的api,
参考之前expo自带react-navigation后不需要link或install否则报错的经验,
没有做任何关于react-native-svg的操作,直接跑项目,显示SVG图标OK!
=>另外的问题:svg图标只能显示黑色,修改Svg组件参数无效。因为svg文件的path节点没有fill属性。加上即可<path fill="#FFF">
=>svg图片有些格式不同(time)或是某些部分缺失,在项目里会报错,目前是手动转换格式,但应该有别的办法,或者写脚本来统一
react-native flex:1的含义
flex-grow: 1 主轴上放大比例。只有一个元素则撑满
flex-shrink:1 主轴上缩小比例,即如果空间不足,该项目将缩小。
flex-shrink:1 在分配多余空间之前,项目占据的主轴空间。1就是100%