精华内容
下载资源
问答
  • uniapp改变radio大小

    2021-03-01 13:47:34
    半年前使用uniapp+ColorUI+安卓写了一款app,最近在进行一些优化和修改,顺便记录一下遇到的一些小问题,遇到的一些可以记录下来的优化点,其实uniapp用来做一些比较简单...在默认的radio选择框里面 我这里男生和女生

    半年前使用uniapp+ColorUI+安卓写了一款app,最近在进行一些优化和修改,顺便记录一下遇到的一些小问题,遇到的一些可以记录下来的优化点,其实uniapp用来做一些比较简单的app还是挺不错的,比较快捷,容易管理~~

    uni-app 是一个使用 Vue.js 开发跨平台应用的前端框架,开发者编写一套代码,可编译到iOS、Android、H5、小程序等多个平台。

    文档:https://uniapp.dcloud.io/

    话不多说,今天遇到了一个小问题
    在默认的radio选择框里面

    我这里男生和女生的radio显得比较大,比字体都要大一点,看起来很不舒服。想要给调整小一点。一开始我就在上面加了一个宽度和高度,设置没有成功,没有反应。

    后面翻看了一下官方文档,找到了一个比较简单的属性

     style="transform: scale(0.77)"
    

    于是找到代码
    直接添加了这个属性

    <view class="cu-form-group">
    				<view class="title">性别</view>
    				<radio-group @change="radioChange" style="transform: scale(0.77)">
    					<label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in sex" :key="item.value">				
    							<radio style="margin-right:10px" :value="item.value" :checked="item.checked" /><span style="margin-right:10px">{{item.label}}</span>
    					</label>
    				</radio-group>
    			</view>
    

    ok,保存代码
    刷新之后会发现
    radio大小就变小了

    在这里插入图片描述

    展开全文
  • radio-group> <label v-for="(item, index) in List" :key="index"> <radio :class="active == index ? 'checked' : ''" :checked="active== index" :value="index" @click="radioChange(index)"/>...

    html代码

    <radio-group>
        <label v-for="(item, index) in List" :key="index">
            <radio :class="active == index ? 'checked' : ''" :checked="active== index" :value="index" @click="radioChange(index)"/>
        </label>
    </radio-group>
    

    js代码

    export default {
        data() {
            return {
            	// 演示数组
                List: [{
                    id: '1',
                    price: 100.00,
                    name: '商品1'
                }, {
                    id: '2',
                    price: 200.00,
                    name: '商品2'
                }],
                active: null // 选中的序号
            }
        },
        methods: {
            radioChange(index) {
                if (this.active== index) { // 如果已经选中,则取消选中
                    this.active= null;
                } else { // 否则进行选中赋值
                    this.active= index;
                }
            }
        }
    }
    
    展开全文
  • uniapp中修改radio的样式

    千次阅读 2020-05-14 09:23:06
    uniapp中修改radio的样式 解决方法 在App.vue文件中写样式(只能在App.vue中写,否则就没有效果) uni-radio .uni-radio-input { width: 44upx; height: 44upx; }

    uniapp中修改radio的样式

    解决方法

    在App.vue文件中写样式(只能在App.vue中写,否则就没有效果)

    uni-radio .uni-radio-input {
    	width: 44upx;
    	height: 44upx;
    }
    
    展开全文
  • uniappradio颜色渐变

    2020-10-19 17:20:57
    在css中添加如下代码,即可实现选中状态渐变 .uni-radio-input-checked{ background: linear-gradient(142deg,#FF9200 0%,#FF2B2B 100%); }

    在css中添加如下代码,即可实现选中状态渐变

    .uni-radio-input-checked{
    	background: linear-gradient(142deg,#FF9200 0%,#FF2B2B 100%);
    }
    
    展开全文
  • 一、打开 /node_modules/uview-ui/components/u-radio/u-radio.vue 文件 二、找到 setRadioCheckedStatus() 函数 三、函数修改为 setRadioCheckedStatus() { this.emitEvent(); if(this.parent) { if (this....
  • uniapp中如获取radio的value值

    千次阅读 2020-02-26 17:30:17
    uniapp官网关于radio-group的介绍 @change 监听 radio-group 变化,当 radio-group 发生改变时触发的方法,当用户点击按钮时触发的方法。 checkOne(e) 方法名随便起,传入参数 e (e为对象), 在控制台打印 e 发现...
  • L 先生:大 boosM 先生:全栈技术一枚最近呢,M 先生上线了一个支付功能,支付功能...对于一个 NB Plus 的全栈 M 先生,首先想到的是使用 单选框(radio),于是打开 uniapp 的官方文档,使用的是uview-ui,找到 radio...
  • uniapp—修改radio组件的大小

    千次阅读 2019-05-07 15:46:10
    radio组件的样式大小太大了,和我的文字大小不匹配,看起来很难看 于是给radio设置了width和 height ,然而并不起作用 最后是使用transform:scale(0.7);完美解决问题 ...
  • 半年前使用uniapp+ColorUI+安卓写了一款app,最近在进行一些优化和修改,顺便记录一下遇到的一些小问题,遇到的一些可以记录下来的优化点,其实uniapp用来做一些比较简单的app还是挺不错的,比较快捷,容易管理~~ ...
  • 微信小程序 .wx-checkbox-input-checked, .wx-radio-input-checked, .wx-switch-input-checked { background-color: #0099ff !...uniapp .uni-checkbox-input-checked, .uni-radio-input-checked, .uni
  • 新手刚入门uniapp,在昨天遇到了一个小问题:在
  • 以Colorui-Uniapp表单页面修改例子!在标签使用transform:scale(0.7);即可完美解决问题 ! css3的transform中scale缩放的使用方法 从3个方面介绍: 1、scale(x,y) 对元素进行缩放 X表示水平方向缩放的倍数 | Y...
  • 本篇以uniapp项目为例 开始之前要先排除uniapp官网的这种写法 { value: 'CHN', name: '中国', checked: 'true' }, 不要以里面checked的取值来判断是否应该...
  • <label><checkbox value="cb" checked="true" color="#FFCC33" style="transform:scale(0.7)" />选中 </label> 直接在标签内加上相应的属性就行了。 color:是选中时对勾的颜色;...
  • uniapp初识笔记

    2019-10-08 03:41:15
    写在前面: 页面布局 尽量不要flex 布局了,ios滚动不流畅。底部有固定按钮的,使用fixed。 1、引入less通过编辑器,工具-插件安装- ...需要手动设置宽度4、radio 标签使用包裹在 radio-group 标签里,使用chan...

空空如也

空空如也

1 2 3
收藏数 50
精华内容 20
关键字:

radiouniapp