大家开发过程中可能遇到过这个问题,就是在项目中使用了react-navigation以后,在navigation的header里 需要获取this操作当前页面中的内容,但是无法获取到;
最常见的处理办法是自定义header 然后隐藏掉static的header,显示自定义的header;
这个办法可以实现在header上操作页面内的内容,但是往往存在一个问题,一不小心会出现各页面header不一致的情况,维护和管理起来比较麻烦,还要单独考虑适配问题,比如iPhone X;
下面介绍一种可以获取this的方式:
第一步,在当前文件内新增一个方法,将需要进行的操作写在方法内
自定义方法,显示小弹窗
第二步:将该方法作为参数放入navigation对象中
在componentWillMount()中,将该方法设置为navigation的参数(将整个方法作为一个对象来使用)
将this中该方法设置为navigation中的参数
第三步:在navigation中获取该对象,实现对当前页面内容的操作的调用;
通过调用navigation中的参数,调用this中的方法
效果图
其他对象内容可以类比实现
网友评论