radio两行每行只能选择一个的解决方案！

 

如图，我要做到这个效果，竖着每行只能有一个最像，和最不像，点击左边禁用右边

 <div v-else>
        <div v-if="progress<quiz.length" class="jumbotronjumbotron-fluid mt-3">
            <div class="container" :name="quiz[progress].subjectId">
                <h1 class="display-4">
                    <!--问题-->
                    {{quiz[progress].subject}}
                </h1>

                  最像   最不像
                <div v-for="(item,index) in quiz[progress].items" :key="index"
                     class="form-check my-4 ">

                    <label class="from-check-label">
                        <!--单选按钮绑定答题是谁，值为itemsValue-->
                        <input type="radio"  v-on:click="likenessflag(index,item.id)" class="form-check-input"   name="likeness" value="item.id" title="最像"  >
                              
                        <input type="radio"  v-on:click="unlikeflag(index,item.id)" class="form-check-input" name="unlike" value="item.id" title="最不像" >

                        <span class="badge badge-pill badge-primary mx-3">
                    {{itemsValue[index]}}
                    </span>
                    {{item.title}}
                    </label>
                </div>

　　思路就是每次点击就解除对面所有数据，然后重新禁用就好了

    likenessflag:function(index,v){

                $('input[name="unlike"]').attr("disabled",false);
                $('input[name="unlike"]')[index].disabled=true;

                this.show=false;

            },
            unlikeflag:function(index,v){
                $('input[name="likeness"]').attr("disabled",false);
                $('input[name="likeness"]')[index].disabled=true;


                this.show=false;


            },

　　

转载于:https://www.cnblogs.com/q1359720840/p/11100872.html