知识点:组件,animation,获取当前点击元素的索引与内容 微信小程序中没有select下拉选项框,所以只有自定义.自定义的话,可以选择模板的方式,也可以选择组件的方式来创建. 这次我选择了组件,这样只需引入组件和添加数据,其它的不用管,就能实现多个地方重复使用了. 第一步:创建组件所需的文件 我喜欢把共用的内容都放在和pages文件同级的地方,所以有了下面的目录结构 (1) 先创建一个自定义名字的文件夹,例如我上面的Componet (2) 再创建一个select文件夹,然后:右键这个文件…
在小程序中没有像h5中的下拉 标签的 picker又满足部了,那就自己动手写 <view class='list-msg'> <view class='list-msg1'> <text>商品金额</text> <text>¥99.00</text> </view> <!--下拉框 --> <view class='list-msg2' bindtap='bindShowMsg'> <text…
下拉刷新 1.首先在.json文件中配置(如果在app.json文件中配置,那么整个程序都可以下拉刷新.如果写在具体页面的.json文件中,那么就是对应的页面下拉刷新.) 具体页面的.json文件: { "enablePullDownRefresh":true } app.json文件: "window":{ "enablePullDownRefresh": true } 2.js文件中添加回调函数 /** * 页面相关事件处理函数--监听用户下…
一般在列表展示页面,会使用到上拉加载和下拉刷新功能,在scroll-view中有bindscrolltolower事件,可以实现上拉加载功能,但是却没法实现下拉刷新. 如需同时使用两种功能,解决步骤如下(以list页面为例): 1. 将scroll-view 改成普通的view, 并且设置样式 // list.wxsspage { height: %; } .container { width: %; height: %; // 或者 height: 100vh; } // 其他样式略 2. 在…
项目需要做了一个图片拖动指定组件上删除,和排序的功能android测试正常, ios会出现拖动图片页面也跟着下滑的尴尬情况. 查文档下拉刷新配置默认是关闭的,后经查找文档发现在本页面page.json 配置项可通过 { "disableScroll":true }   来禁用页面下拉滚动 不可在全局配置 app.json中配置 disableScroll 设置为 true 则页面整体不能上下滚动:只在 page.json 中有效,无法在 app.json 中设置该项   至此问题解决,…
一.json文件开启页面刷新 开启页面刷新.在页面的json文件里配置两处: "enablePullDownRefresh": true, //true代表开启页面下拉刷新 "backgroundColor": "#d3d3d3" //背景色设置为灰色,可以看到下拉刷新的效果 { "usingComponents": {}, "navigationBarTitleText": "列表下拉刷新&qu…
1.在微信小程序中,想到 下拉刷新 和 上拉加载,如果是整个页面都拖动的话,可以在页面配置中,配置 enablePullDownRefresh 和 onReachBottomDistance 然后在 .js 中 使用 Page.onPullDownRefresh 和 Page.onReachButton 这样来进行. 2.上面的做法是官方推荐我们做页面的 下拉刷新 和 上拉加载 所使用的方法.但某种情况比如头部是固定的,但使用上面的方法,整个页面都拉动,会显得很奇怪.这个时候,我们的滚动实际上是…
全栈开发工程师微信小程序-中(下) 微信小程序视图层 wxml用于描述页面的结构,wxss用于描述页面的样式,组件用于视图的基本组成单元. // 绑定数据 index.wxml <view> {{message}} <view> index.js Page({ data: ({ message: 'Hello' }) }) // 组件属性 // data中的数据绑定到微信小程序组件上 <view id="item-{{id}}"></view&…
在项目中经常要用到一个容器元素占满屏幕高度和宽度,然后再在这个容器元素里放置其他元素. 宽度很简单就是width:100% 但是高度呢,我们知道的是height:100%必须是在父元素的高度给定了的情况下才可以. 以前我的做法是用js获取屏幕的高度,然后将其赋值给height, 屏幕高度在网页中为:window.innerHeight; 在微信小程序中则需要调用wx.getSystemInfo接口,然后通过setData赋值 但是显然通过js来进行的,效率上肯定不如css直接给定样式. 于是我们…
在微信小程序中我们往往需要展示一些丰富的页面内容,包括图片.文本等,基本上要求能够解析常规的HTML最好,由于微信的视图标签和HTML标签不一样,但是也有相对应的关系,因此有人把HTML转换做成了一个富文本转化插件wxParse,方便我们使用,前人种树后人乘凉,我们使用它来解析HTML就很方便了,这对于我们在后端已经完成的一些HTML内容,展示在小程序里就非常不错. 这个插件的Github地址如下:wxParse-微信小程序富文本解析组件,官方称它支持支持HTML及markdown解析,我这里主…