Form表单中radio，option不回显问题

出现不回显原因

数据类型不匹配，例如"1"与1是无法匹配绑定的

各种写法解决实例

v-model绑定的是int型数据

各种写法:

          <el-col :span="12">
            <el-form-item label="广告类型" prop="adType">
              <el-select v-model="form.adType" placeholder="请选择广告类型">
                <el-option v-for="dict in dict.type.sys_ad_type" :key="dict.value" :label="dict.label"
                           :value="dict.value*1">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>


          <el-col :span="24">
            <el-form-item label="状态" prop="adValid">
              <el-radio-group v-model="form.adValid">
                <el-radio v-for="dict in dict.type.sys_ad_status" :key="dict.value"
                          :label="dict.value*1">
                  {{ dict.label }}
                </el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>


          <el-col :span="24">
          <el-form-item label="状态" prop="adValid">
            <label v-for="(item, index) in dict.type.sys_ad_status">
              <input type="radio" v-model="form.adValid" :value="item.value" />{{ item.label}}
            </label>
          </el-form-item>
          </el-col>


          <el-col :span="12">
            <el-form-item label="广告类型" prop="adType">
              <el-select v-model="form.adType" placeholder="请选择广告类型">
                <el-option label="外部广告" :value="0" ></el-option>
                <el-option label="内部广告" :value="1" ></el-option>
              </el-select>
            </el-form-item>
          </el-col>


          <el-col :span="24">
            <el-form-item label="状态" prop="adValid">
              <el-radio-group v-model="form.adValid">
                <el-radio :label="1">上架</el-radio>
                <el-radio :label="0">下架</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>

tips: value="0"与:value="0"的区别

<el-option label="外部广告" :value="0" ></el-option>

<el-option label="外部广告" value="0" ></el-option>

:value="0"是Vue中的一种简写，它相当于v-bind:value=“0”，它的作用是将一个属性的值绑定到一个表达式上，这里的表达式是0，也就是一个数字。
Vue中有很多这样的简写，它们可以让我们的代码更简洁，更易读。例如：

v-bind可以简写为:，它用于绑定属性的值。
v-on可以简写为@，它用于绑定事件的监听器。
v-slot可以简写为#，它用于绑定插槽的名称。

• <el-option label="外部广告" :value="0" ></el-option> 这个代码是使用了Vue的指令:，它的作用是将一个属性的值绑定到一个表达式上，这里的表达式是0，也就是一个数字。这意味着，当用户选择了这个选项后，下拉列表的值就会变成0这个数字，而不是"0"这个字符串。³⁴
• <el-option label="外部广告" value="0" ></el-option> 这个代码是没有使用Vue的指令:，它的作用是将一个属性的值直接设置为一个字符串，这里的字符串是"0"，也就是一个包含了数字0的字符串。这意味着，当用户选择了这个选项后，下拉列表的值就会变成"0"这个字符串，而不是0这个数字。³⁴

这两个代码的区别是，前者的value属性是绑定到一个数字上的，后者的value属性是直接设置为一个字符串的。这个区别可能会影响到下拉列表的值与其他变量或数据的匹配

v-model绑定的是String型数据

和上面同样的思路,转为统一数据类型
通过 + ‘’ ，统一处理成 string 类型