首页 > 解决方案 > 如何将 v-rating 设置为固定在 vuetify 上?

问题描述

我正在使用 vue.js 和 vuetify 构建一个页面,我需要将我的 v-rating 固定在我想要的值上,我不希望用户可以更改该值。这是我到目前为止所拥有的。

  <v-layout align-center justify-center row wrap>
    <v-flex xs12 md4 v-for="(idioma, i) in idiomas":key="i">
      <h3>{{idioma.comp}}:</h3>
      <v-img id="imgCompetencias":src="idioma.imagem"height="100"width="100"></v-img>
      <v-rating v-model="idioma.rating" half-increments></v-rating><br><hr id="divisor"><br>
    </v-flex>
  </v-layout>

  <script>
   export default {
    data() {
     return {
      idiomas: [
            {
             imagem: require("@/assets/images/imgCompetencias/ingles.png"),
             comp: 'Inglês',
             rating: 4,
            },
            {
             imagem: require("@/assets/images/imgCompetencias/espanhol.png"),
             comp: 'Espanhol',
             rating: 2.5,
            },
          ],
         }
        }
      };
   </script>

标签: vue.jsvuetify.js

解决方案


Just add readonly as attribute. Read more in the docu: https://vuetifyjs.com/en/components/ratings


推荐阅读