Javascript 在vuejs中设置html5数据属性无效

我正在尝试使用Vue将数据属性添加到锚标记。我一定错过了一些琐碎的事情

我已经做了我认为应该做的事情，这是我的模板：

<template>
    <a :class="entityStates.switch['switch.' + switchName].state === 'on' ? 'active ' : ''"
       v-bind:data-name="entityStates.switch['switch.' + switchName].friendly_name"
       @click.prevent="changeSwitch('switch.' + switchName, $event)"
       class="button small-button d-flex align-items-center justify-content-center"
       href="#"
       v-if="entityStates !== null">
        <component :is="icon" :size="30"></component>
        <!--        <{{ icon }}-icon title="" :size="30"></{{ icon }}-icon>-->
    </a>
</template>

---

但是在渲染组件时，我没有得到任何

数据名

属性。我在这里遗漏了什么？

您能提供EntityState代码（数据结构）吗？这就是全部内容。。我忘记了我的

EntityState

中的一个级别。你能提供EntityState代码（数据结构）吗？这就是全部。。我忘记了我的

实体状态中的一个级别。