首页  >  问答  >  正文

在 Vue3 中使用自定义指令将数据传递到组件:指南

我想实现这种行为

<simple-component v-layer="'pizza'" />

使用自定义指令,将 'pizza' 传递给组件,并能够在我的 SimpleComponent 中使用它。

这个想法是随后将其放在上层父范围中(通过 v-slot ),它很老套,可能不是最好的方法,但语法对我的客户很重要(这里输入的字符越少越好)。

我发现了 Vue2 的这个 github 问题,但我不确定如何使其适用于 Vue3 甚至语法(我知道它不是 vNode.context 而是 binding.instance 现在,而且我们不需要 $set 因为 Vue3 使用代理)。

文档并没有真正帮助我,并且在常规开发工具中检查实例也没有给我任何线索。

PS:我们可以在 SimpleComponent 本身中做几乎任何事情,我们只是不需要从组件的外部看到它。

P粉407936281P粉407936281206 天前340

全部回复(1)我来回复

  • P粉776412597

    P粉7764125972024-03-27 19:51:04

    免责声明

    这是很hacky的,而且可能不是正确的方法,因为它违背了Vue API(这清楚地表明它是只读),所以是的:您可能不想那样使用它。

    此外,指令用于 DOM 元素修改,而不是在其他地方到达和改变 Vue 状态。我团队的需求非常棘手。
    不要在家里复制它,而是使用常规道具。


    同时,如果您这样做,请按以下方法操作。

    page.vue

    
    
    sssccc
    

    SimpleDiv.vue

    
    
    sssccc
    

    回复
    0
  • 取消回复