javascript - 通过 vue 中的对象动态分配指令

Question

如果我在 vue 中有一个组件：

<template>
    <component v-bind="dynamicAttrs"></component>
</template>

我想为它分配一些动态属性，其中 v-demo 是一个自定义指令：


data() {
  return {
    dynamicAttrs: {
      'class': 'foo'
      'v-demo': true
    }
  }
}

虽然我可以看到 dom 中的属性，但在这种情况下自定义指令不会触发。

有没有办法可以通过 vue 中的对象动态分配指令？

score 0 · Accepted Answer

0

v-bind是一个指令。您不能将指令与另一个指令一起应用

于 2021-03-03T19:02:59.870 回答

score 0 · Accepted Answer

迈克尔说的是真的，但也许你可以解决一下：

<template>
    <component :is="customComponentName" :data="dynamicAttrs"></component>
</template>

然后您可以创建一个根据您输入的数据呈现的自定义组件。 https://vuejs.org/v2/guide/components.html#Dynamic-Components

选项2：

创建一个自定义指令并将动态值放入参数中：

<template>
    <component v-demo:[show]="dynamicMethod" :class="{}" />
</template>

2 回答 2