vuetify <v-list-tile>元素不应用颜色属性

时间:2019-04-14 09:51:15

标签: html vue.js vuetify.js

我具有以下列表设置,但无法为v-list-tile设置颜色,使其看上去保持不变色。这是模板:

 <v-container>
      <v-flex xs12>
        <v-card color="rgba(75,75,75,1)">
          <v-card-title><h4>Details</h4></v-card-title>
          <v-divider></v-divider>
          <v-list dense>
            <v-list-tile v-for="(value,key) in testData" dark color="rgba(85,85,85,1)">
              <v-list-tile-content >{{key}}</v-list-tile-content>
              <v-list-tile-content class="align-end">{{value}}</v-list-tile-content>
            </v-list-tile>
          </v-list>
        </v-card>
      </v-flex>
    </v-container>

enter image description here

这是结果。 似乎只有v-card应用了color属性 v-divider以下的所有内容都不会更改其颜色

1 个答案:

答案 0 :(得分:-1)

在v-list-tile中,颜色属性仅更改文本的颜色。

如果要设置背景样式,最简单的方法是使用内联样式。

<v-list-tile
  style="background-color:rgba(85,85,85,1)"
  ...
</v-list-tile>