为了账号安全,请及时绑定邮箱和手机立即绑定

react高阶组件如何调用子组件的方法较好?

react高阶组件如何调用子组件的方法较好?

扬帆大鱼 2018-10-19 14:09:59
我有一个普通得表格组件DataGrid,一个高阶组件Mask会把传入的组件外面包一层遮罩组件,使得原来得组件拥有显示和隐藏遮罩的功能。现在的问题是,原来如果某个页面中直接使用DataGrid,我可以直接给DataGrid加一个ref(比如articleGrid),然后可以使用this.refs.articleGrid.reload(), reload是DataGrid上的方法。但是加了包裹了高阶组件后,就不能直接使用,还要在高阶组件中给要结合的组件加上ref才行,就变成了this.refs.articleGrid.refs.wrappedComp.reload()如果是更复杂的情况写法就更恶心,现在我有点怀念继承了。。请问有什么好的实践处理这种问题得吗。
查看完整描述

1 回答

?
慕田峪7331174

TA贡献1828条经验 获得超13个赞

首先,感觉你的设计有点问题,按照一般逻辑,应该是DataGrid包含Mask,而不是Mask包含DataGrid。所以感觉你这里用高阶组件很奇怪。。。如果是DataGrid包含Mask的话,那么就很容易了,不多说

其次,官网上已经不推荐直接使用refs了,而是通过获取目标组件的instance。安利一下自己的文章,React高阶组件(HOC)模型理论与实践,其他部分写得不好,不用看。所以,其实你不需要用那么多refs来获取目标组件,直接this.dataGrid.load()就好了


查看完整回答
反对 回复 2018-11-24
  • 1 回答
  • 0 关注
  • 1737 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号