v-bind 怎么绑定两个属性

`v-bind` 是 Vue.js 中的一种缩写，全称 `v-bind:class` 或 `v-bind:style`，它用于将 HTML 元素的属性绑定到 Vue 实例的数据属性上。如果你想同时绑定两个属性，比如 class 和 style，可以在一个对象中一起声明：

<div v-bind="{ class: className, style: cssStyle }"></div>

在这里，`className` 和 `cssStyle` 都是你在 Vue 实例中定义的数据属性。`class` 属性用于样式类绑定，`style` 属性用于内联 CSS 修饰符绑定。

示例：

new Vue({
  el: '#app',
  data: {
    activeClass: 'active', // 样式类名
    elementStyles: { color: 'red', fontSize: '16px' } // 内联样式
  },
  computed: {
    className() {
      return this.activeClass ? this.activeClass : '';
    },
    cssStyle() {
      return this.elementStyles;
    }
  }
})

当你更新 `activeClass` 或 `elementStyles` 的值时，对应的 HTML 元素的 class 或 style 会自动相应地更新。