// html : 

<div class="applyInformations" @click="chooseSex">
<p>性别</p>
<input type="text" placeholder="请输入您的性别" v-model="sex" disabled style="background:#fff;"/>
</div> <mt-popup v-model="popupVisible" position="bottom" class="mint-popup" style="width: 100%;height: 30%;">
<p class="addChooseButton"><span @click.stop="cancelp(1)">取消</span><span @click.stop="cancelp(2)">确定</span></p>
<mt-picker :slots="slots" @change="onValuesChange" :visible-item-count="5" :show-toolbar="false" ref="picker" value-key="name"></mt-picker>
</mt-popup>

  

data() {
return {
phone:'',
userName:'',
sex:'',
popupVisible:false, // 时间控制选择开关
slots: [
{
flex: 1,
values: ['男','女'],
className: 'slot1',
textAlign: 'center'
}
]
}
}, cancelp(index){
const _this = this ;
if(index===2){
this.popupVisible = false ;
}else{
this.popupVisible = false ;
_this.sex = ''
}
},
// 小时选择()
onValuesChange(packer,val){
console.log(packer,val,'分')
const _this = this ;
_this.sex = val[0]
},

  css :

.applyInBox .picker-toolbar{
height: 50px;
padding-top: 15px;
}
.applyInBox .mint-datetime-action{
font-size: 30px;
}
.applyInBox .picker-slot{
font-size: 30px;
}
.applyInBox .picker-item.picker-selected{
color:red;
}

  

mt-picker 样式修改的更多相关文章

  1. input placeholder属性 样式修改(颜色,大小,位置)

    placeholder属性 样式修改 <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...

  2. ExtJS控件样式修改及美化

    Extjs项目对富客户端开发提供了强有力的支持,甚至改变了前端的开发方式,使得开发变得更加趋向于“面向组件”.对界面的美化而言,也是根本性的改变.普通的网页美工面对extjs项目根本无法下手,需要脚本 ...

  3. 帝国cms 列表页分页样式修改美化【2】

    上一篇(帝国cms 列表页分页样式修改美化[1])中我们已经对分页说了一个大概,下面我们就自己动手弄一个分页把: 第一步:进入帝国cms后台,点击系统设置->系统参数设置->信息设置:里面 ...

  4. 【前端】webkit内核浏览器DIV滚动条样式修改和设置

    webkit内核浏览器DIV滚动条样式修改和设置 引言: 最近在做自己的小项目,为了设计出好看的页面费劲了心思,大到页面的整体布局,小到DIV的滚动条都不放过,以下是我通过查阅资料总结的webkit内 ...

  5. H5 音频标签自定义样式修改以及添加播放控制事件

    说明: 需求要求这个音频标签首先要是可适配移动端浏览器的,音频样式就是参考微信做的. 最终效果如下: 具体实现 思路: H5 的 <audio> 标签是由浏览器负责实现默认样式的.所以不同 ...

  6. HTML5中 audio标签的样式修改

    由于html5的流行,现在移动端大多数的需求都可以使用audio来播放音频,但您可能只是需要很简单的播放/停止效果,但不同的浏览器上的audio样式却不尽人意,那么要怎么改变这个样式呢,其实它的原理比 ...

  7. Excel图表编辑---表格移动,样式修改

    一.移动位置和调整大小 先鼠标选中如下面这个图片,之后点击上方的设计按钮,随后选择右边的, 再选择,就可以实现图片的表格之间的移动. 其中移动图表里面的,选中这个之后,图表的大小会根据窗口的大小自动调 ...

  8. 微信小程序开发小技巧——单击事件传参、动态修改样式、轮播样式修改等

    一. 脚本部分: 1. 表达式无效的处理: 如果你发现自己编写的表达式无效或者数据不展示,那么请先检查你的表达式是否有添加{{}},小程序中全部都要添加的,只要是在模板中调用js中的数据 2. 获取元 ...

  9. progress进度条的样式修改

    由于公司在做的公众号上需要进度条,我就想着用progress标签,可是progress标签很难修改样式,因而在网上查询了一番. 现在总结一下. progress是H5新标签,主要用于显示进度条.由于他 ...

  10. chrome和IE下的滚动条样式修改

    火狐下的滚动条样式无法去修改,但chorme下的则可以任意修改,惊喜的是IE竟然是最早实现这一功能的浏览器,IE5都能有效果. chorme下的滚动条样式修改: <!DOCTYPE html&g ...

随机推荐

  1. LVS总结

    一, LVS介绍 LVS linux virtual server 即linux虚拟服务器,是由章文嵩博士主导的开源负载均衡项目,目前LVS已经被集成到Linux内核模块中. 集群: 将多个服务器集中 ...

  2. 三条路线告诉你如何掌握Spring IoC容器的核心原理

    原文链接:https://blog.csdn.net/bntx2jsqfehy7/article/details/78977178

  3. -bash: findstr: command not found 问题解决

    今天有个任务,需要获取apk的版本信息,百度之后说是之下下面的命令就行 adb shell dumpsys package com.baidu.searchbox | findstr versionC ...

  4. tensorboard可视化(先写一点点)

    在tensorboard上显示运行图: import tensorflow as tf a = tf.constant(10,name="a") b = tf.constant(9 ...

  5. HAProxy+Heartbeat双节点出现VIP情况

    本文使用heartbeat做高可用,主节点192.168.0.204,备节点192.168.0.205,vip192.168.0.206,防火墙启动状态 先启动主节点,再启动备节点后,发现以下问题: ...

  6. Django2 + python3 上传图片

    . ├── db.sqlite3 ├── manage.py ├── myImg │   ├── __init__.py │   ├── __pycache__ │   │   ├── __init_ ...

  7. django的安装和初步使用

    安装参考:步骤也可以参考这个 很详细 https://blog.csdn.net/zww1984774346/article/details/54408759 如果想在终端查看项目结构 需要用到tre ...

  8. AutoLayout面试题记录-自动布局

    1. 面试上海某家软件公司,题目是这样,有一个View,距左右父View长度一定,高度一定.这个View上面有4个小View,高度相同(或者说一定), 要求不管屏幕怎么变,这4个小View总是等宽平分 ...

  9. 编辑器直接word直接上传word里的图片

    tinymce是很优秀的一款富文本编辑器,可以去官网下载.https://www.tiny.cloud 这里分享的是它官网的一个收费插件powerpaste的旧版本源码,但也不影响功能使用. http ...

  10. 使用IDEA在引入Schema空间时报错URI is not registered解决方法以及Idea @Autowired取消提示 方法

    使用IDEA在引入Schema空间时报错URI is not registered解决方法以及Idea @Autowired取消提示 方法   Idea @Autowired取消提示 spring b ...