微信小程序(十七)输入组件详细介绍
投入输入框使用的频率也是比较高的。样式的话自己外面包裹个视角自己定义输入。属性也不是很多,有需要自己慢慢测,尝试
主要属性:
wxml
!表示"…式样的”:家庭式|教堂式的优先级比班级高会覆盖和班级相同属性-view class=' inputView ' style=' margin-top : 40% ' input class=' input ' type=' number ' placeholder='请输入账号占位符-样式=' color : red ' bind input=' listener phone input '/view view class=' input view ' input class=' input ' password=' true '占位符='请输入密码占位符-style=' color : red ' bind input=' listener passwordpinput '/view button style=' margin-left : 15 rpx;右边距: 15 rpx边距-top : 50 rpx;border-radius : 40 rpx ' type=' primary ' bind tap=' listener log in '登录/buttonjs
页面({ /** *初始化数据*/data:{ phone: ' ',password: ' ',},/** *监听手机号输入*/listenerPhoneInput:函数{这个。数据。电话=e . detail。价值;}, /** * 监听密码输入*/listeners spassworinput :函数{这个。数据。密码=e .详细信息。价值;}, /** * 监听登录按钮*/listenerLogin:函数(){ //打印收入账号和密码console.log('手机号为:这个。数据。电话);console.log('密码为:这个。数据。密码);},onLoad:function(选项){ //页面初始化选择为页面跳转所带来的参数},onReady:function(){ //页面渲染完成},onShow:function(){ //页面显示},onHide:function(){ //页面隐藏},onUnload:function(){ //页面关闭}})wxss。输入{左填充: 10px高度: 44px}。inputView{ border: 2px纯红;边界半径: 40px左边距左侧: 15px右边距: 15px页边距-top : 15px;}相关文章:
你好WeApp图标组件窗口文本组件转换组件tabBar底部导航进步组件行动表应用生命周期按钮组件情态的组件页面生命周期检验盒组件烤组件模块化详形式组件详装货组件数据绑定投入组件领航员组件视角组件采摘者组件声音的组件滚动视图组件收音机组件录像组件swiper组件滑块组件图像组件
版权声明:微信小程序(十七)输入组件详细介绍是由宝哥软件园云端程序自动收集整理而来。如果本文侵犯了你的权益,请联系本站底部QQ或者邮箱删除。