当前位置: 首页 > news >正文

ElementUI中checkbox v-model绑定值为布尔、字符串或数字类型

这篇博客介绍了在Vue.js中使用El-Checkbox组件时,如何设置和处理`v-model`的布尔值和类型转换。通过示例代码展示了如何设置`true-label`和`false-label`属性来改变选中状态的值,适用于需要特定类型(如字符串或整数)的场景。

 v-model不能直接写正则表达式
比如:
let grpItemsItem={itemStatus:0};
v-model="grpItemsItem.itemStatus==0 ? false : true"
打印grpItemsItem对象的结果是:itemStatus==0 ? false : true

正确使用方式如下,

<template><!-- `checked` 为 true 或 false --><el-checkbox v-model="checked">备选项</el-checkbox>
</template>
<script>export default {data() {return {checked: true};}};
</script>

字符串

<el-checkbox v-model='checked' true-label='1' false-label='0'>备选项</el-checkbox>

int类型

 <el-checkbox v-model='checked' :true-label=1 :false-label=0>备选项</el-checkbox>

相关文章:

  • Docker如何更换镜像源提高拉取速度
  • NLP高频面试题(四十八)大语言模型中的思维链(CoT)技术详解
  • LintCode第192题-通配符匹配
  • 解决 Ubuntu 下 VTune 无法收集 CPU 硬件时间计数数据的问题
  • FramePack:让视频生成更高效、更实用
  • Vue2集成ElementUI实现左侧菜单导航
  • 电子电器架构 ---软件定义汽车的电子/电气(E/E)架构
  • HarmonyOS-ArkUI: animateTo 显式动画
  • mapbox进阶,实现掩膜效果,并控制掩膜透明度
  • OpenCV---图像预处理(四)
  • 使用 Flutter 遇坑小计
  • Uniapp:pages.json页面路由
  • ESP-ADF外设子系统深度解析:esp_peripherals组件架构与核心设计(显示输出类外设之IS31FL3216)
  • 【无人机】无人机的电调校准,ESC Calibration,PX4使用手册电调校准详细步骤
  • 超详细实现单链表的基础增删改查——基于C语言实现
  • 基于 FFmpeg 的音视频处理基础原理与实验探究
  • 运维概述(linux 系统)
  • 《解锁增强型上下文学习,打造你的专属智能助手》
  • 徐州服务器租用:虚拟主机的应用场景
  • Spring AI MCP
  • “女孩被前男友泼汽油烧伤致残案”二审择期宣判
  • “小时光:地铁里的阅读”摄影展开幕,嘉宾共话日常生活与阅读
  • 上海群文创作大检阅,102个节目角逐群星奖
  • 不降息就走人?特朗普试图开先例罢免美联储主席,有无胜算
  • 2025年世界互联网大会亚太峰会数字金融论坛举行
  • 陈尚君:唐文治的环球旅行