zoukankan      html  css  js  c++  java
  • ElementUI中el-radio-group使用v-model绑定是属性为String字符串类型时不回显数据

    场景

    结合el-radio-group元素和子元素el-radio可以实现单选组,在el-radio-group中绑定v-model,在el-radio中设置好label即可,无需再给每一个el-radio绑定变量,另外,还提供了change事件来响应变化,它会传入一个参数value。

    官方示例代码:

    <template>
      <el-radio-group v-model="radio">
        <el-radio :label="3">备选项</el-radio>
        <el-radio :label="6">备选项</el-radio>
        <el-radio :label="9">备选项</el-radio>
      </el-radio-group>
    </template>
    
    <script>
      export default {
        data () {
          return {
            radio: 3
          };
        }
      }
    </script>

    注:

    博客:
    https://blog.csdn.net/badao_liumang_qizhi
    关注公众号
    霸道的程序猿
    获取编程相关电子书、教程推送与免费下载。

    实现

    按照上面官方的示例代码使用的时候,发现在编辑时获取数据后没法回显数据。

    原因是示例代码中返回的数据绑定的radio是一个数组3,而在实际业务中绑定的属性是字符串“3”

    所以需要在“”外面再加一层‘’

                  <el-radio-group v-model="form.jxbclx" @change="$forceUpdate()" size="medium">
                    <el-radio :label='"1"'>井下大班</el-radio>
                    <el-radio :label='"2"'>井下小班</el-radio>
                  </el-radio-group>

    就能实现回显数据了。

  • 相关阅读:
    HTML标签
    进程&线程&协程
    04 jQuery的属性操作
    03 jQuery动画效果
    02 jQuery的选择器
    01 jQuery的介绍
    软件测试入门-测试模型(V型 W型 H型)
    软件测试概述
    软件测试基础理论
    17 案例
  • 原文地址:https://www.cnblogs.com/badaoliumangqizhi/p/13495495.html
Copyright © 2011-2022 走看看