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

vue3 antdv RadioButton默认值选择问题处理

1、先上官方文档:

Ant Design Vue — An enterprise-class UI components based on Ant Design and Vue.js

官方代码:

<template><div><div><a-radio-group v-model:value="value1"><a-radio-button value="a">Hangzhou</a-radio-button><a-radio-button value="b">Shanghai</a-radio-button><a-radio-button value="c">Beijing</a-radio-button><a-radio-button value="d">Chengdu</a-radio-button></a-radio-group></div><div :style="{ marginTop: '16px' }"><a-radio-group v-model:value="value2"><a-radio-button value="a">Hangzhou</a-radio-button><a-radio-button value="b" disabled>Shanghai</a-radio-button><a-radio-button value="c">Beijing</a-radio-button><a-radio-button value="d">Chengdu</a-radio-button></a-radio-group></div><div :style="{ marginTop: '16px' }"><a-radio-group v-model:value="value3" disabled><a-radio-button value="a">Hangzhou</a-radio-button><a-radio-button value="b">Shanghai</a-radio-button><a-radio-button value="c">Beijing</a-radio-button><a-radio-button value="d">Chengdu</a-radio-button></a-radio-group></div></div>
</template>
<script lang="ts">
import { defineComponent, ref } from 'vue';
export default defineComponent({setup() {const value1 = ref<string>('a');const value2 = ref<string>('a');const value3 = ref<string>('a');return {value1,value2,value3,};},
});
</script>

上面的代码,我们看出来是个string;

 const value1 = ref<string>('a')

2、处理代码,强转String就可以了

formStateNode.nodetype =node.nodetype == undefined || node.nodetype == null ? '0' : String(node.nodetype);

这样,我们就可以看到,默认是选择的,因为nodetype是个number类型的,如果将nodetype:string;  这样也是不可以,一定要强转一下,因为数据库中返回的是Integer。

相关文章:

vue3 antdv RadioButton默认值选择问题处理

1、先上官方文档&#xff1a; Ant Design Vue — An enterprise-class UI components based on Ant Design and Vue.js 官方代码&#xff1a; <template><div><div><a-radio-group v-model:value"value1"><a-radio-button value"a…...

最佳实践,一款基于 Flutter 的桌面应用

前言 这篇文章介绍作为一名后端开发人员&#xff0c;快速的入门前端或者客户端一些相关的技术的心得。先来说说为什么作为一名后端开发人员也需要学习一些前端或者客户端相关的技术。通常来说&#xff0c;深耕一个领域没有错&#xff0c;因为社会常常就是这样分工的&#xff0…...

python第一个多进程爬虫

使用 multiprocessing 模块实现多进程爬取股票网址买卖数据的基本思路是&#xff1a; 定义爬虫函数&#xff0c;用于从一个或多个股票网址上抓取数据。创建多个进程&#xff0c;每个进程执行爬虫函数&#xff0c;可能针对不同的股票或不同的网页。使用 multiprocessing.Queue …...

在Ubuntu 18.04上安装和配置Ansible的方法

前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到网站。 简介 配置管理系统旨在简化对大量服务器的控制&#xff0c;适用于管理员和运维团队。它们允许您从一个中央位置以自动化的方式控制许多…...

【详细教程】如何使用YOLOv10进行图片与视频的目标检测

《博主简介》 小伙伴们好&#xff0c;我是阿旭。专注于人工智能、AIGC、python、计算机视觉相关分享研究。 ✌更多学习资源&#xff0c;可关注公-仲-hao:【阿旭算法与机器学习】&#xff0c;共同学习交流~ &#x1f44d;感谢小伙伴们点赞、关注&#xff01; 《------往期经典推…...

LLM大语言模型-AI大模型全面介绍

简介&#xff1a; 大语言模型&#xff08;LLM&#xff09;是深度学习的产物&#xff0c;包含数十亿至数万亿参数&#xff0c;通过大规模数据训练&#xff0c;能处理多种自然语言任务。LLM基于Transformer架构&#xff0c;利用多头注意力机制处理长距离依赖&#xff0c;经过预训…...

瑜伽馆管理系统的设计

管理员账户功能包括&#xff1a;系统首页&#xff0c;个人中心&#xff0c;管理员管理&#xff0c;教练管理&#xff0c;用户管理&#xff0c;瑜伽管理&#xff0c;套餐管理&#xff0c;体测报告管理&#xff0c;基础数据管理 前台账户功能包括&#xff1a;系统首页&#xff0…...

JAVA【案例5-2】模拟默认密码自动生成

【模拟默认密码自动生成】 1、案例描述 本案例要求编写一个程序&#xff0c;模拟默认密码的自动生成策略&#xff0c;手动输入用户名&#xff0c;根据用户名自动生成默认密码。在生成密码时&#xff0c;将用户名反转即为默认的密码。 2、案例目的 &#xff08;1&#xff09…...

小区业主管理系统

摘 要 随着城市化进程的加速和人口的不断增加&#xff0c;小区的数量也在不断增加。小区作为城市居民居住的主要场所&#xff0c;其管理工作也变得越来越重要。传统的小区业主管理方式存在诸多问题&#xff0c;如信息传递不畅、业务处理效率低下等。因此&#xff0c;开发一个高…...

vncsever ,window 远程ubuntu远程界面安装方式,VNC Viewer安装教程+ linux配置server 操作

linux 端安装 # 安装VNC 服务器软件 sudo apt install autocutsel # 剪切黏贴操作支持的包 sudo apt-get install tightvncserver # 安装的是 VNC 服务器软件&#xff0c;用于远程桌面访问 # 安装Xfce桌面环境 sudo apt-get install xfce4 xfce4-goodies #安装的是 XFCE 桌…...

java spring boot 单/多文件上传/下载

文章目录 使用版本文件上传服务端客户端&#xff08;前端&#xff09;方式一方式二 文件下载服务端客户端&#xff08;前端&#xff09; 代码仓库地址 使用版本 后端 spring-boot 3.3.0jdk17 前端 vue “^3.3.11”vite “^5.0.8”axios “^1.7.2” 文件上传 上传文件比较…...

C语言的内存函数

1. memcpy使⽤和模拟实现 1 void * memcpy ( void * destination, const void * source, size_t num ); • 函数memcpy从source的位置开始向后复制num个字节的数据到destination指向的内存位置。 • 这个函数在遇到 \0 的时候并不会停下来。 • 如果source和destination有任…...

【网络通信】计算机网络安全技术总结

一、概述 在数字时代的浪潮下&#xff0c;计算机网络安全技术已成为保护数据完整性和安全性的基石。这项技术不仅是计算机科学的重要组成部分&#xff0c;也是应对各种网络威胁和挑战的关键手段。 二、核心技术和应用 2.1 加密技术 作为网络安全技术的核心&#xff0c;加密技…...

Redis-实战篇-什么是缓存-添加redis缓存

文章目录 1、什么是缓存2、添加商户缓存3、前端接口4、ShopController.java5、ShopServiceImpl.java6、RedisConstants.java7、查看Redis Desktop Manager 1、什么是缓存 缓存就是数据交换的缓冲区&#xff08;称为Cache&#xff09;&#xff0c;是存贮数据的临时地方&#xff…...

《妃梦千年》第十一章:再遇故人

第十一章&#xff1a;再遇故人 宫中的局势暂时平静下来&#xff0c;但林清婉知道&#xff0c;危险随时可能卷土重来。她必须不断提升自己&#xff0c;才能在这复杂的环境中保护自己和皇上。一天&#xff0c;林清婉正在寝宫中读书&#xff0c;忽然收到了一封信。信中只有短短几…...

反序列化底层学习

反序列化底层学习 前言 以前也是懒得学&#xff0c;觉得没有必要&#xff0c;学到现在发现好多东西都需要学习java的底层&#xff0c;而且很多漏洞都是通过反序列化底层挖出来的&#xff0c;比如weblogic的一些绕过&#xff0c;我这里也主要是为了学习weblogic来学习的&#…...

项目训练营第五天

项目训练营第五天 后端代码优化 通用异常处理类编写 Data public class BaseResponse<T> implements Serializable {int code;T data;String message null;String description null;public BaseResponse(int code, T data, String message, String description) {th…...

数据收集和数据分析

数据分析和收集是一个多步骤的过程&#xff0c;涉及到不同的方法和思维构型。 以下是一些常见的数据收集方法和数据分析的思维模式&#xff1a; ### 数据收集方法&#xff1a; 1. **调查问卷**&#xff1a; 通过设计问卷来收集定量或定性数据。&#xff08;质量互变规律里面…...

Kubernetes(K8s)从入门到精通系列之十九:Operator模式

Kubernetes K8s从入门到精通系列之十九&#xff1a;Operator模式 一、动机二、Operators in Kubernetes三、Operator示例四、部署Operator五、使用Operator六、编写自己的operator Operator 是 Kubernetes 的软件扩展&#xff0c;它利用自定义资源来管理应用程序及其组件。 Ope…...

vuex的actions返回结果类型是promise及actions方法互相调用

this.$store.dispatch(‘logout’)返回的结果是Promise类型的 调用成功的情况下&#xff0c;返回状态为fulfilled&#xff0c;值为undefined。 所以可以直接进行.then操作&#xff1a; this.$store.dispatch(logout).then((result) > {console.log(result); });因为 Vuex …...

绝地求生游戏辅助工具:罗技鼠标宏自动化配置指南

绝地求生游戏辅助工具&#xff1a;罗技鼠标宏自动化配置指南 【免费下载链接】logitech-pubg PUBG no recoil script for Logitech gaming mouse / 绝地求生 罗技 鼠标宏 项目地址: https://gitcode.com/gh_mirrors/lo/logitech-pubg 在《绝地求生》这款高强度的战术竞技…...

AI辅助开发:描述需求,快马AI自动生成旅行商问题算法与可视化

最近在做一个旅行商问题(TSP)的算法项目&#xff0c;想试试用AI辅助开发能有多高效。结果发现InsCode(快马)平台的AI功能真的帮了大忙&#xff0c;整个过程特别顺畅。这里分享一下我的体验。 需求分析阶段 刚开始我只是简单描述了需求&#xff1a;"需要一个用模拟退火算…...

OpenClaw家装设计:Qwen2.5-VL-7B根据户型图生成3D效果示意图

OpenClaw家装设计&#xff1a;Qwen2.5-VL-7B根据户型图生成3D效果示意图 1. 为什么选择OpenClaw做家装设计自动化 去年装修新房时&#xff0c;我花了大量时间在设计师和施工队之间来回沟通。每次修改设计方案都需要等待设计师重新出图&#xff0c;周期长、成本高。直到发现Op…...

气象数据可视化实战:从雷达图到三维风场,前端技术栈全解析

气象数据可视化实战&#xff1a;从雷达图到三维风场&#xff0c;前端技术栈全解析 气象数据的可视化一直是前端开发领域最具挑战性的方向之一。想象一下&#xff0c;当你需要将每小时更新的全球气象数据转化为直观的动态图像&#xff0c;让气象学家一眼就能看出台风路径、让飞行…...

小米智能家居跨区域协同控制技术指南

小米智能家居跨区域协同控制技术指南 【免费下载链接】ha_xiaomi_home Xiaomi Home Integration for Home Assistant 项目地址: https://gitcode.com/GitHub_Trending/ha/ha_xiaomi_home 随着智能家居设备数量的快速增长&#xff0c;多区域设备协同工作已成为提升居住体…...

I.MX6U-MINI开发板系统固化全流程:从uboot编译到rootfs烧录(附网络配置技巧)

I.MX6U-MINI开发板系统固化实战指南&#xff1a;从零构建到网络调优 第一次拿到I.MX6U-MINI开发板时&#xff0c;面对系统固化的多个环节总有种无从下手的感觉。作为嵌入式Linux开发的入门门槛&#xff0c;系统固化不仅关系到后续应用开发的基础环境&#xff0c;更是理解嵌入式…...

低成本低功耗认证芯片推荐——LCS4110R

LCS4110R是以32位安全CPU内核为基础的高性价比安全芯片&#xff0c;符合EAL4安全等级设计要求&#xff0c;自带DES/TDES硬件协处理器。LCS4110R芯片是业内拥有自主设计的产品&#xff0c;集成内部文件系统&#xff0c;支持LKCOS系统&#xff0c;自主可控&#xff0c;供货稳定。…...

小型纯电动汽车轮毂电机及大角度转向系统的数字化设计【含catia、solidworks、CAD图纸、答辩PPT、说明书】

小型纯电动汽车轮毂电机与大角度转向系统的数字化设计&#xff0c;是新能源汽车领域的关键技术突破方向。轮毂电机通过将驱动装置集成于车轮内部&#xff0c;实现了动力传递路径的简化与能量利用效率的提升&#xff0c;其分布式驱动特性使车辆具备更灵活的扭矩分配能力&#xf…...

掌握QMK Toolbox的4个实战阶段:开源键盘定制工具从入门到精通的学习路径

掌握QMK Toolbox的4个实战阶段&#xff1a;开源键盘定制工具从入门到精通的学习路径 【免费下载链接】qmk_toolbox A Toolbox companion for QMK Firmware 项目地址: https://gitcode.com/gh_mirrors/qm/qmk_toolbox QMK Toolbox是一款专为机械键盘定制开发的开源工具&a…...

GME-Qwen2-VL-2B自动化测试:基于模型视觉理解的GUI界面测试脚本

GME-Qwen2-VL-2B自动化测试&#xff1a;基于模型视觉理解的GUI界面测试脚本 1. 引言 你有没有遇到过这样的场景&#xff1f;辛辛苦苦写了一套UI自动化测试脚本&#xff0c;结果软件界面稍微改个按钮颜色、挪个位置&#xff0c;整个测试就全挂了。维护成本高得吓人&#xff0c…...