Question

我想给图标颜色加上for循环。我已经尝试过这种方式。但是没有结果。我知道可以绑定样式。

<v-tab v-for="navtab in navtabs" :key="navtab">
    <v-icon color="{{ navtab.color }}">{{ navtab.icon }}</v-icon>
</v-tab>

数据属性：

<script>
export default {
    data () {
      return {
      navtabs: [
        {
          icon: 'info',
          name: 'About Book',
          color: 'teal darken-2'
        },

        {
          icon: 'favorite',
          name: 'Specification',
          color: 'orange darken-2'
        }
      ]
   }
}

我该怎么做？

Answer 1

您不应使用：

<v-icon color="{{ navtab.color }}">{{ navtab.icon }}</v-icon>

相反，绑定可变颜色：

<v-icon :color="navtab.color">{{ navtab.icon }}</v-icon>

用Vuejs绑定颜色

1 个答案: