vue中设置获取自定义值

在 Vue 中设置和获取自定义值可以通过自定义指令来实现。以下是一个简单的例子：

<template>
  <div v-mydirective:myvalue="myProp"></div>
</template>

<script>
export default {
  data() {
    return {
      myProp: 'hello world'
    }
  },
  directives: {
    mydirective: {
      bind(el, binding) {
        el.dataset[binding.arg] = binding.value
      }
    }
  }
}
</script>

在上面的例子中，我们定义了一个名为 `mydirective` 的自定义指令，然后将其绑定到一个元素上。这个自定义指令接受一个参数 `myvalue`，并将组件的 `myProp` 值设置为这个参数。具体来说，`bind` 钩子函数会在指令绑定到元素上时调用，它会将参数作为元素的 `data-*` 属性存储。这样，我们就可以在其他地方获取这个自定义值了。

例如，我们可以在组件的 `mounted` 钩子函数中获取这个自定义值：

mounted() {
  const el = this.$el.querySelector('div')
  const myValue = el.dataset.myvalue
  console.log(myValue) // 'hello world'
}

这样，我们就可以在 Vue 中设置和获取自定义值了。需要注意的是，自定义指令只是一种方式，你也可以通过其他方式来实现类似的效果。