微信小程序原生组件input文本输入框，点击聚焦后，placeholder占位符文字位置会向上编移，原因是input使用了box-sizing: border-box;样式的同时添加了上下内边距（padding）或上下外边距（margin），解决方法可以把box-sizing:border-box;或者上下内外边距去掉。 示例： wxml代码 <input type="text" confirm-type="search" placeholder-class="placeholder" placeholder="输入关键词搜索"/> wxs...

微信小程序常用的小交互效果，简单的tab切换，点击菜单选项，切换到对应指数的内容模块。 wxml代码 <view class="tabBtn"> <block wx:for="{{tabBtn}}" wx:key="index"> <view class="item{{curTab == index ? ' active' : ''}}" bindtap="clickTab" data-idx="{{index}}">{{item}}</view> </block> </view> <...

在需要点击拨打电话的标签上绑定一个点击事件bindtap，代码： <view class="call" bindtap="makeCall">拨打电话</view> 在点击事件的方法里使用wx.makePhoneCall Page({ data: { phone:'400 888 8888', }, makeCall:function(){ wx.makePhoneCall({ phoneNumber:this.data.phone //或者直接phoneNumber:'400 888 8888' ...

微信小程序分别获取点击input文本框取得焦点时的value值，失去input文本框焦点时的value值。 wxml代码： <input type="text" bindblur="blurVal" bindfocus="focusVal" value="{{keyword}}"/> js代码 Page({ data: { keyword: '' }, bindblur: function(event){ var val = event.detail.value; console.log(val); }, ...

在data:{}声明初始化了一个变量，在onLoad:function()函数调用时，出现“xxx is not defined”错误，原因是直接使用了变量名，没有使用获取页面data对象的this.data 会报错的原代码： Page({ data: { text:'Welcome' }, onLoad: function(options){ console.log(text); }, }) 正确写法 Page({ data: { text: 'Welcome' }, onLoad: function...

Tabbar是固定在页面底部的导航栏的配置属性，下面是添加方法及参数说明。 注意： Tabbar导航栏至少需要添加2个菜单，最多五个，否则会报错。 一般代码结束符号是;分号，小程序代码的结束符号是,逗号。 编辑全局配置文件app.json，在第一层花括号{}里添加代码（参数在后面） "tabBar":{ "color":"#333333", "selectedColor":"#128ff9", "borderStyle":"black", "list":[ ...