suzic
V2EX  ›  Vue.js

VUE 自定义指令的问题

  •  
  •   suzic · Aug 17, 2020 · 2507 views
    This topic created in 2121 days ago, the information mentioned may be changed or developed.

    如何在元素前插入一个自定义的组件? 比如我有一个图标组件,想在所有使用此指令的 a 元素前都插入此图标,应该怎么做?

    6 replies    2020-08-18 12:45:38 +08:00
    Doracis
        1
    Doracis  
       Aug 18, 2020
    抛砖引玉一个:自定义一个组件,用到的时候再引入,另外提醒一句,千万不要有 所有 a 标签都会用到的错觉,一定给自己留好后路
    varzy
        2
    varzy  
       Aug 18, 2020 via iPhone
    指令里面不是可以拿到 dom 吗?有了 dom 不就可以为所欲为了。不好做的话可以引入 jquery 试试🌚
    lonhongg
        3
    lonhongg  
       Aug 18, 2020
    从描述来看 用 class + 伪元素解决会好一点?

    如果一定要指令的形式,比如 v-addicon 在生成指令的时候获取 dom,然后获取 index 、parent 、sublingual,就能计算出要插入的位置了。
    lonhongg
        4
    lonhongg  
       Aug 18, 2020
    生成指令 => inserted
    lonhongg
        5
    lonhongg  
       Aug 18, 2020
    emm 重新看了下描述,上面说的有点偏题

    如果是插入自定义组件的话,建议添加一个新组件,结构为图标组件+slot 。
    suzic
        6
    suzic  
    OP
       Aug 18, 2020 via Android
    @lonhongg 非常感谢回复,综合你们的建议,我放弃了插入组件的方式,改用 dom 生成这个元素了,这样的话既不用加类名也不用引入组件,用起来比较方便
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   4354 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 36ms · UTC 10:09 · PVG 18:09 · LAX 03:09 · JFK 06:09
    ♥ Do have faith in what you're doing.