最近搜索

vue3 单选按钮的注意事项 动态绑点 字符串 数字

浏览:15
管理员 2026-01-04 13:10

image.png


数字类型 和 字符串类型。 值是数字  值是 字符串。


<el-table-column prop="status" label="状态" width="200" align="center">
  <template v-slot="{row}">
    <el-switch v-model="row.status" @change="statusChangeHandle(row)" active-text="正常"
               inactive-text="禁用" :active-value="0" :inactive-value="1"></el-switch>
  </template>
</el-table-column>


我之前用的带引号的active-value="0"  这是字符串,加上引号就是数字类型了。
el-switch 的 active-value="0" 和 inactive-value="1" 这里写的是 字符串类型(带引号)


<el-table-column prop="status" label="状态" width="200" align="center">
  <template v-slot="{row}">
    <!-- 关键修改:添加 : 进行动态绑定,值为数字 0/1,去掉引号 -->
    <el-switch 
      v-model="row.status" 
      @change="statusChangeHandle(row)" 
      active-text="正常"
      inactive-text="禁用" 
      :active-value="0"  <!-- 动态绑定数字0,非字符串 -->
      :inactive-value="1"  <!-- 动态绑定数字1,非字符串 -->
    ></el-switch>
  </template>
</el-table-column>




动态绑定字符串

<el-form-item label="状态" prop="status">
    <el-radio-group v-model="form.status">
        <el-radio :label="'0'">正常</el-radio>
        <el-radio :label="'1'">禁用</el-radio>
    </el-radio-group>
</el-form-item>



联系站长

站长微信:xiaomao0055

站长QQ:14496453