vuetify element不应用颜色属性

Posted 2021-03-30

我有以下列表设置，但我无法为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>

这就是结果。只有v-card似乎应用颜色属性v-divider下面的一切都没有改变它的颜色

答案

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

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

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