uniapp的radio-group动态赋值

最新推荐文章于 2024-01-17 18:35:36 发布
最新推荐文章于 2024-01-17 18:35:36 发布
阅读量3.6k 收藏 2
点赞数 1
分类专栏： 前端 文章标签： vue.js elementui 蓝桥杯
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Mr_ZhangAdd/article/details/122099431
版权 
<radio-group @change="radioChange" style="margin-left: 40rpx;">
			<radio style="margin-right: 40rpx;" value="1" :checked="radioValue==1" >生产</radio>
			<radio style="margin-right: 40rpx;" value="2" :checked="radioValue==2" >订单</radio>
			<radio style="margin-right: 40rpx;" value="3" :checked="radioValue==3" >采购</radio>
			<radio style="margin-right: 40rpx;" value="4" :checked="radioValue==4" >次品</radio>
</radio-group>

定义一个变量radioValue，checked通过这个变量去选中就可以了

根据业务场景给radioValue赋值

Mr_ZhangAdd
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
uni-app将radio-group元素分列展示（七）
A_nanda的博客
05-17 425
点检类型:</view></view>--复选框改成下拉列表--><view class="title driverdata">设备类型:
Animated-Radio-Group
05-08
动画广播组 具有精美动画的简单android广播组。 特征： 默认支持不同类型的动画 您可以轻松添加新动画 易于定制的组件 按照LinearLayout原理工作 可以包含不同的嵌套子元素 用法 依赖关系： // in file build.gradle of application dependencies { compile 'com.github.MIFProjects:Animated-Radio-Group:1.0.2' } // in file build.gradle of project allprojects { repositories { maven { url "https://jitpack.io" } ... } } XML用法 < com .mif.animatedradiogrpouplib.An
vue.js选中动态绑定的radio的指定项
10-19
主要介绍了vue.js选中动态绑定的radio的指定项,需要的朋友可以参考下
Vue动态生成el-checkbox点击无法赋值的解决方法
12-03
前言 最近遇到一个问题，在一个页面需要动态渲染页面内的表单，其中包括 checkbox 表单类型，并且使用 Element 组件 UI 时，此时 v-model 绑定的数据也是动态生成的 例如： 定义的 data 的 form 里面是空对象，需要动态生成里面的 key export default { data() { return { form: {} } }, } 从后端接口得到 checkList，这个就是动态生成的表单数据 v-for 循环 checkList，得到 key，然后直接 v-model=“form.key” 动态生成 form 里面的 key <el-
uni——单选、多选、复选款自定义样式、重置
努力、拼搏、奋进
11-28 4760
uni——单选、多选、复选款自定义样式、重置
uniapp单选框radio-group动态赋值
imcholl的博客
05-24 4029
uniapp 官网关于单选框的详解 ：https://uniapp.dcloud.io/component/radio.html 实现思路 定义一个变量conclusionRadio，checked的状态通过更改这个值去更新。 可以根据业务场景调用updateConclusionStatus(true) 或者 updateConclusionStatus(false) 方法 代码如下 <view class="chk-conclusion"> <label class="label-ti
uni-app 之组件 入门教程 uniapp在线教程 uni app视频教程
04-22
讲解uni-app中如何使用组件，主要讲解了基础组件，表单组件等常用的组件，课程主要是针对uni app组件入门学习者。
uniapp中单选按钮的实现
weixin_64103049的博客
10-25 1万+
uniapp中单选按钮的实现
uniapp 单选框 radio-group 组件change方法传递多个参数
nelly521的博客
08-14 960
【代码】uniapp 单选框 radio-group 组件change方法传递多个参数。
uniapp中组件库的Radio 单选框丰富的使用方法
精通前端技术，了解后端接口
01-03 4683
可以通过设置shape为square或者circle，将单选框设置为方形或者圆形此处所指的颜色，为radio选中时的背景颜色，参数为
react-radio-group-context：使用新的Context API编写的React的Radio Group组件
02-03
react-radio-group-context 使用新的Context API编写的React无线组组件 :face_with_open_mouth: 为了使用这个组件，您必须使用React 16.3或更高版本。 较早版本的React无法实现该库依赖的Context API。为什么？ ...
react-custom-radio-buttons-group
08-04
react-custom-radio-buttons-group 是一个精心设计的单一React组件，可帮助您创建单选按钮组。 安装/入门 这个包在 NPM 存储库中作为 react-custom-radio-buttons-group 提供。 它将与所有流行的打包器一起正常工作...
uni-app的组件（二）
最新发布
2302_78070106的博客
01-17 1464
uni-app的组件
uniapp内置radio-group设置大小和颜色
m0_60459392的博客
10-10 745
style="transform:scale(0.6)" 是大小。uniapp内置radio-group设置大小和颜色。
uniapp：单选框radio-group的自定义样式
weixin_58791464的博客
11-04 1723
项目中使用单选框radio-group不想使用原来的样式，怎么自己自定义呢？
《uni-app》表单组件-Checkbox组件
热门推荐
Oliver尹的博客
08-31 1万+
本文主要分享了uni-app中内置组件checkbox的一些用法，主要包括属性如value属性，禁用属性，选中属性等，以及checkbox提供的默认事件change的使用，最后示例了一个结合v-for指令，button组件完成了一个动态生成checkbox并获取选中值的示例demo；.........
uniapp中的单选实例（ radio）
babyxuqian的博客
11-04 9223
radio-groupsd 单项选择器，内部由多个<radio>组成。通过把多个radio包裹在一个radio-group下，实现这些radio的单选。 属性说明 属性名 类型 默认值 说明 @change EventHandle <radio-group>中的选中项发生变化时触发 change 事件，event.detail = {value: 选中项radio的value} radio 单选项目。 属性说明 属......
uniapp radio-group 例子
04-26
好的，关于 uniapp 的 radio-group 示例，可以参考以下代码： ```html <template> <view> <radio-group class="radio-group" @change="onChange"> <radio value="1" checked="true">选项一</radio> <radio value="2">选项二</radio> <radio value="3">选项三</radio> </radio-group> <text> 你选择的是：{{radioValue}} </text> </view> </template> <script> export default { data() { return { radioValue: '1' } }, methods: { onChange(event) { this.radioValue = event.target.value; } } }; </script> <style> .radio-group { margin-bottom: 30rpx; } </style> ``` 以上是一个简单的示例，展示了如何使用 radio-group 这个组件，以及如何获取用户选择的值。请注意，radio-group 需要包含多个 radio 组件，每个 radio 组件都有自己的 value 值，在用户选择时，radio-group 的 value 值会被更新为所选 radio 的 value 值。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值