小程序input框中加入小图标
最近入坑小程序,要求在小程序的输入框中展示一个小图标,页面如下:
然后按照,html页面中的做法,在input框中添加了background-image属性,出乎意料的事,小程序报了下边这样一个错误:
emmmm 好像小程序的background-image属性并不给力啊,然后查阅相关资料后,放弃了background-image属性。
然后另辟蹊径,由于小程序中,好像只有image标签才能加载本地图片,所以考虑使用image标签来实现,大致思路就是在一个view中,左边是image,右边是input框,wxml页面如下:
由于太懒,所以直接把样式写在了wxml页面,嗯,最后页面效果如第一张图所示。若有问题,欢迎讨论~~
小程序input框中加入小图标相关推荐
- 微信小程序input框中加入小图标的实现方法
最近入坑小程序,要求在小程序的输入框中展示一个小图标,页面如下: 然后按照,html页面中的做法,在input框中添加了background-image属性,出乎意料的事,小程序报了下边这样一个错误: ...
- 微信小程序 input框进行双向绑定
在微信小程序的规则中,input标签中的数据为单向绑定,无法像Vue框架中的v-model直接进行input的双向绑定. 下面有一种思路来解决双向绑定这个思路. 1.利用bindinput记录下inp ...
- 小程序搜索框_微信小程序搜索及优化相关知识科普
生活中我们常常会用到微信小程序,但很多人不知道该如何搜索.找到小程序:而有些已经做了自己的小程序的商家,也不懂怎么提升自己的微信小程序搜索效果.所以下面就跟大家科普下这两个问题. 1.怎么搜索微信小程 ...
- 微信小程序input框输入值校验
1.定义正则方法 // 校验输入价格的正则方法checkInputText: function (text) {var reg = /^(\.*)(\d+)(\.?)(\d{0,2}).*$/g; / ...
- 微信小程序input框只能输入小数/正整数
官方组件说明:https://developers.weixin.qq.com/miniprogram/dev/component/input.html 给type不同的值就好,以下示例不满足则需要I ...
- 微信小程序input框在某些手机上获取数据失败
因为加了有数据为空不允许提交的判断,测试的时候发现有的手机总是提示有数据为空,不能提交, 测试之后发现是填写手机号的input框type类型为number,然后写了三个框分别获取数据, type类型分 ...
- uniapp开发微信小程序input框限制输入
input框输入手机号的约束 <input @input="onlyNum" class="inp" v-model="phone" ...
- 微信小程序 input框实现搜索历史记录
实现效果如下 聚焦显示历史记录 关联历史记录 注意点 结构上需要将input框和下面的historyList作为一个整体,可自行控制展示历史记录的规格: 使用微信缓存API wx.getStorage ...
- 微信小程序input框输入值获取
提交表单时获取输入框的值 wxml <view><!-- 携带 form 中的数据触发 submit 事件 --><form bindsubmit="submi ...
最新文章
- 机器学习一定要很优秀才能做嘛?其实我们都可以。
- java 获取私有方法_如何获取java类里的私有方法
- Nancy in .Net Core学习笔记 - 视图引擎
- 如何在Jackson中使用PropertyNamingStrategy
- 阿里云 MaxCompute 2020-4 月刊
- Ubuntu 16.04 安装CUDA8.0+Cudnn6.0+TensorFlow+Caffe安装
- msvcrt python linux,Python msvcrt.CrtSetReportMode方法代码示例
- java当前目录指什么_是什么决定了Tomcat Java进程的当前工作目录?
- C++函数和类的封装
- 手握14万,博越是最佳选?这车配钢炮动力,可双屏互动,不香?
- Android 性能分析工具介绍
- OpenCV运动目标检测背景差法和帧差法的理解
- 2020年证券从业资格考试《金融市场基础知识》真题汇编卷一
- POI实现超大数据的Excel的读写操作,支持Excel最大行数。
- 2020年即将推出的智能手环APP定制开发
- 计算机技术与课堂教学整合,信息技术与课程整合之我见
- 《棒球英豪》:青春球场·棒球1号位
- ArcGIS JS之 4.23之IIS本地部署与问题解决
- 错误代码:DNS_PROBE_FINISHED_NXDOMAIN解决办法
- 【基于MATLAB的数字图像处理】第三章·基本图像变换