最近实习时在做小程序,有些小tip就一起放到这个文章里了
小程序input弹出软键盘时露出输入框
使用cursor-spacing,可根据页面进行大小修改
<input cursor-spacing="150" maxlength="5" type="text" placeholder="请输入姓名"/>
获取用户手机号码
通过bindinput绑定获取号码的函数
<input maxlength="11" type="number" placeholder="请输入11位手机号码" bindinput="getPhone" value="{{userForms.phone}}" cursor-spacing="200"/>
getPhone(e) {
var val = e.detail.value;
this.setData({
userForms: form
});
},
用户信息轮播
需要在页面顶部只做一个轮播效果,使用swiper
<swiper autoplay="true" interval="4000" vertical="true" circular="true" class='swiper_container'>
<block wx:for="{{recentAsks}}" wx:for-item="it" wx:key="k">
<swiper-item class='userMessage'>
<image class='userAvatar' src="{{it.imgs}}"></image>
<text>{{it.txts1}}<text style='font-weight:bold;'>{{it.txts2}}</text>{{it.txts3}}</text>
</swiper-item>
</block>
</swiper>
滚动效果必须放在外层swiper上,滚动内容放在swiper-item中,block是不加任何效果的容器,只是支持循环.
滚动效果具体数据可见官网
分享给朋友
通过给 button 组件设置属性 open-type=“share”,可以在用户点击按钮后触发 Page.onShareAppMessage() 事件,如果当前页面没有定义此事件,则点击后无效
onShareAppMessage(Object)监听用户点击页面内转发按钮( 组件 open-type=“share”)或右上角菜单“转发”按钮的行为,并自定义转发内容
<button class='shareImg' open-type='share'>分享</button>
onShareAppMessage: function () {
console.log(this.data.priceRange)
let urlLib = `/pages/carselect/chooseSpec?serieid=${this.data.serie_id}`
return {
title: this.data.seriename+'火热促销中',
path: urlLib
}
}
可以看这个文章有更多关于分享的内容:小程序分享