vue中如何在{{}}引用短线命名的变量

Question

vue中如何在{{}}引用短线命名的变量

Answer 1

谢谢，我是在vue-cli中使用的，用的vuetify，如果是在顶层组件中使用没有问题，但是自定义组件中，传参就不能识别，我测了一下，发现自定义组件中{{}}的this变量不存在，测试代码如下：
这是自定义组件

<template>
  <v-btn color="primary" dark :disabled="!is-enabled">
    {{this['btn-text']}}
  </v-btn>
</template>

<script>
export default {
  props: ['btn-text','is-enabled']

}
</script>

这是在顶层引用组件代码

                <Test btn-text="abc" :is-enabled="true"></Test>
                <Test btn-text='def' :is-enabled="false"></Test>

Answer 2

<template>
    <div>
      {{ this["a-b"] }}
    </div>
</template>
data(){
    return {
      'a-b':12
    }
  }