Question

如果单选按钮1可以选择，即使它与另一个单选按钮具有相同的值，该怎么办？

示例：用户选择值包含某些特征的价格的特征。如果我选择1且值为20，则不应选择该字符。 2值20

<script>
        new Vue({
          el: '#app',
          data () {

          }
        })
</script>


<div id="app">
  <v-app id="inspire">
    <v-container fluid>
      <v-layout row wrap>
        <v-flex xs12 md6>
          <v-subheader>Light</v-subheader>
          <v-card flat>
            <v-card-text>
              <p>{{ ex8 || 'null' }}</p>
              <v-radio-group v-model="ex8" :mandatory="false">
                <v-radio label="Radio 1" value="radio-1"></v-radio>
                <v-radio label="Radio 2" value="radio-1"></v-radio>
              </v-radio-group>
            </v-card-text>
          </v-card>
        </v-flex>
        <v-flex xs12 md6>
          <v-subheader>Dark</v-subheader>
          <v-card color="secondary" flat>
            <v-card-text>
              <p class="white--text">{{ ex9 || 'null' }}</p>
              <v-radio-group v-model="ex9" :mandatory="false">
                <v-radio label="Radio 3" value="radio-3" dark></v-radio>
                <v-radio label="Radio 4" value="radio-4" dark></v-radio>
              </v-radio-group>
            </v-card-text>
          </v-card>
        </v-flex>
      </v-layout>
    </v-container>
  </v-app>
</div>

P.S。

codepen.io/Pavel8289/pen/dJwzyV ------ 为什么不通过循环工作？关于问题的答案：＆＃34;我来自乌克兰......＆＃34; ＆gt;＆＃34;环游美国＆＃34;＆gt;任何答案＆gt;最后选择所有项目 -

Answer 1

VueJs确实将渲染优化为尽可能小。将:key添加到您的广播框中：

<v-radio label="Radio 1" value="radio-1" :key="1"></v-radio>
<v-radio label="Radio 2" value="radio-1" :key="2"></v-radio>

Answer 2

“无线电类型的元素通常用于无线电组 - 描述一组相关选项的单选按钮的集合。可以同时选择给定组中的一个单选按钮。”

为组中的每个电台指定相同的名称：

<v-radio label="Radio 1" value="radio-1" name="price-1"></v-radio>
<v-radio label="Radio 2" value="radio-1" name="price-1"></v-radio>

vue.js + vuetify单选按钮在具有相同值

2 个答案: