作者:匿名用户
链接:https://www.zhihu.com/question/325397290/answer/708418099
来源:知乎
那 vue 呢?它连 hoc 都没有,render props 更不现实(jsx自带)
const defaultbutton = { props: { text: string }, template: `<button>{{text}}</button>` } function wrap(comp) { return { components: { comp }, template: `<comp text="123"/>` } } new vue({ components: { textbutton: wrap(defaultbutton) }, template: `<text-button />` })
2. hoc + render props
const defaultbutton = { props: { rendertext: function }, render(h) { return h('button', this.rendertext()) } } function wrap(comp) { return { render(h) { return h(comp, { attrs: { rendertext: () => "123" } }) } } } const textbutton = wrap(defaultbutton) new vue({ render(h) { return h(textbutton) } })
react 的不可变,纯函数。直接导致 hooks 必须使用 const 关键字,不能是 let,这也是 hooks 的奇迹之一
const
keyword 和 "不可变,纯函数" 有什么关系, 若使用 let、var, 是否不能实现hook?
请问怎么用逻辑推理出这条链?
2. 对于你回答中的事实性错误, 你持什么看法?
不知道有没有正确理解你说的“移除一个属性”:
onst defaultbutton = { props: { rendertext: function }, render(h) { return h('button', this.rendertext()) } } function omitrendertext(comp, render) { return { render(h) { const { rendertext, ...others } = this.$attrs return h(comp, { attrs: { ...others, rendertext: render || rendertext } }) } } } const textbutton = omitrendertext(defaultbutton, () => "000") new vue({ render(h) { return h(textbutton, { attrs: { rendertext: () => "123" } }) } })
如果你觉得这篇文章对你还是有很大帮助的话,不介意的话可以加下我刚刚建立的一个学习交流群,有很多相关资料和学习视频:907694362
如对本文有疑问, 点击进行留言回复!!
清除新版Google Chrome浏览器中表单控件(input,button...)默认的黑色边框
荐 20200714——git/mac配置/项目运行步骤/一些报错
antd 菜单组件 使用时报错:Cannot read property ‘isRootMenu‘ of undefined
CSS|div的style=“background-image: url(img/a.bmp)图片显示不出来
硬件仪表盘账号建立指导(一) --WHQL认证测试结果提交账号(一)
cookie的规范Cookie的不可跨域名性或Cookie与域名的关系
网友评论