小编ase*_*hle的帖子

我需要使用CSS悬停与VueJS v-bind:style指令但无法找到有关它的信息.

我需要为悬停绑定样式但v-bind:style.hover={} 不起作用.所有属性都将从后端获取,因此我需要动态绑定样式.

有没有其他方法可以使用VueJS在鼠标悬停或CSS悬停上绑定样式？

这是我的代码

这是对象:

button: {
    colorBackd: '#1e2021',
    colorBackdHover: '#000000',
    text: 'Results',
    color: '#d3e0ff',
    colorHover: "#ffffff",
    borderColor: '#d3e0ff',
    borderColorHover: "#ffffff"
},

这是需要与样式绑定的html元素

<button type="button"
    :style="{
    color:button.color,
        backgroundColor:button.colorBackd,
        borderColor:button.borderColor,
    }"
    class="btn btn-outline-info large-button">

        {{ button.text }}

</button>

谢谢