其实很简单,就是在modal中添加新的 input

<view>
<modal class="modal" wx:if="{{!hiddenModal}}"
title="{{title}}" confirm-text="确定" cancel-text="取消" bindconfirm="modalconfirm" bindcancel="modalcancel">
<view class="input-line">
<input placeholder='请输入内容' maxlength="{{ maxlength }}" bindinput='input' type="text" type="text" value="{{ textvalue }}" />
<text>{{ currentlength}}/{{ maxlength }}</text>
</view>
</modal>
</view> .modal{
width: 540rpx;
max-width: 540rpx;
border-radius: 28rpx;
.input-line {
display: flex;
border: 2rpx solid rgba(0, 0, 0, 0.05);
font-size: 28rpx;
padding: 16rpx;
height: 40rpx;
line-height: 40rpx;
}
input, text{
display: inline-block;
vertical-align: top;
}
input {
flex: 1;
}
text {
width: 90rpx;
color: #FFA004 ;
}
}

小程序封装一个有输入框的modal层组件的更多相关文章

  1. 小程序封装一个ajax

    小程序中,我们一般习惯把提交接口请求的方法放在一个公共js里面.下面是一个简单实现. (1)我们把所有请求的地址都放在一个json里面 var postAddress = { "domin& ...

  2. 微信小程序基础之input输入框控件

    今天主要详写一下微信小程序中的Input输入框控件,输入框在程序中是最常见的,登录,注册,获取搜索框中的内容等等都需要,同时,还需要设置不同样式的输入框,今天的代码中都要相应的使用. input输入框 ...

  3. 微信小程序封装storage(含错误处理)

    这次给你们安利的是微信小程序封装storage,先说下微信官方的 wx.getStorage({ key:"", success: function (res) { }, fail ...

  4. 微信小程序把玩(二十三)modal组件

    原文:微信小程序把玩(二十三)modal组件 modal弹出框常用在提示一些信息比如:退出应用,清楚缓存,修改资料提交时一些提示等等. 常用属性: wxml <!--监听button点击事件-- ...

  5. 微信小程序发布一个月,世界并没有什么不同

    从某种意义上说,在张小龙身上,最可怕的事情莫过于微信小程序发布一个月,一开始的大红大紫居然渐归沉寂,曾经的风光无限已无人谈起,世界并没有什么不同. 这真像一场噩梦,一切都可怕地颠倒了.一款微信的战略级 ...

  6. 小程序实践(六):view内部组件排版

    涉及知识点: 1.垂直排列,水平排列 2.居中对齐 示例: 1.默认排版 , 一个父组件里面两个子view 显示效果: 2.先给父view设置一个高度和颜色值,用于看效果 3.实现水平排列和垂直排列的 ...

  7. 微信小程序把玩(二十八)image组件

    原文:微信小程序把玩(二十八)image组件 image组件也是一个程序不可缺少的,可以这样说一个app中image组件随处可以看到,一般 image有两种加载方式第一种是网络图片第二种是本地图片资源 ...

  8. 微信小程序把玩(二十九)video组件

    原文:微信小程序把玩(二十九)video组件 视频播放组件与图片加载组件也没啥差别,使用起来也没啥注意的 重要属性: wxml <!--监听button点击事件--> <button ...

  9. 微信小程序把玩(二十四)toast组件

    原文:微信小程序把玩(二十四)toast组件 toast消息提示框,可用在提示一些信息,比如清楚缓存给用户一个友好的提示!或操作一些请求不想让用户有什么操作,toast也可以做到因为toast显示时其 ...

随机推荐

  1. andriod\iphone视频禁止全屏播放

    x-webkit-airplay="true" x5-playsinline="true" webkit-playsinline="true" ...

  2. 常见的七种Hadoop和Spark项目案例

    常见的七种Hadoop和Spark项目案例 有一句古老的格言是这样说的,如果你向某人提供你的全部支持和金融支持去做一些不同的和创新的事情,他们最终却会做别人正在做的事情.如比较火爆的Hadoop.Sp ...

  3. USNews2018世界大学1250所排行榜

    USNews2018世界大学1250所排行榜(最全版) 中外学术情报<更多内容2017-10-27 09:00:00 10月24日,USNews发布2018世界大学排行榜,来自全球74个国家或地 ...

  4. LinkedBlockingDeque 源码分析

    LinkedBlockingDeque LinkedBlockingDeque 能解决什么问题?什么时候使用 LinkedBlockingDeque? 1)LinkedBlockingDeque 是基 ...

  5. java实现多种加密模式的AES算法-总有一种你用的着

    https://blog.csdn.net/u013871100/article/details/80100992 AES-128位-无向量-ECB/PKCS7Padding package com. ...

  6. Oracle-数据导出和导入

    对数据库进行逻辑备份或数据转储,也就是对数据库实时导入.导出操作时,既可以使用常规的EXP/IMP客户端程序,也可以使用数据泵技术:IMPDP/EXPDP 使用数据泵导出或导入的优点: 1.数据泵导出 ...

  7. 阶段1 语言基础+高级_1-3-Java语言高级_1-常用API_1_第3节 Random类_9-生成指定范围的随机数

    左闭右开区间

  8. 阶段1 语言基础+高级_1-3-Java语言高级_04-集合_08 Map集合_4_Map集合遍历键找值方式

    键找值的方式 增强for 增强for的简化方式

  9. UI自动化之日志的处理

    写自动化时,我们常常希望打印出浏览器的操作记录,也同时希望报错的记录能够保留并用于问题的排查,这时候可以用到loggging模块 目录 1.logging文件 2.调用日志 1.logging文件 # ...

  10. ubuntu环境下重启mysql服务报错“No directory, logging in with HOME=-”

    前提:使用系统的环境 3.13.0-24-generic mysql的版本:5.6.33 错误描述: 首先用mysqld_safe启动报错如下: root@zabbix-forFunction:~# ...