element-ui中给表格添加单选框组(el-radio-group)

element-ui中给表格添加单选框组(el-radio-group)_第1张图片
需求如下:默认选择每一行的双向通行,然后可以点击其他并且有排斥的效果

主要是使用三元表达式的多次判断

代码如下:

                <el-table-column prop="b" label="管理" width="620" show-overflow-tooltip align="center">
                    <template slot-scope="scope">
                        <el-radio-group v-model="scope.row.HandleState" @change="agreeChange(scope.row.HandleState)">
                            <el-radio :label="1">单向向上</el-radio>
                            <el-radio :label="2" style="margin-left: 40px;">单向向下</el-radio>
                            <el-radio :label="scope.row.HandleState==1?0:(scope.row.HandleState==2?0:scope.row.HandleState)"  style="margin-left: 40px;">双向通行</el-radio>
                        </el-radio-group>
                    </template>
                </el-table-column>

精华所在:

<el-radio :label="scope.row.HandleState==1?0:(scope.row.HandleState==2?0:scope.row.HandleState)"  style="margin-left: 40px;">双向通行</el-radio>

你可能感兴趣的:(vue)