微信小程序 - 方法

微信开放文档地址:基础 | 微信开放文档

\ 转义字符的处理 - 特殊字符如：‘<’、‘>’、‘&’   decode="true"

<text decode="true">&nbsp; &lt;</text>

\ image标签去掉默认高度：mode="widthFix"

<image src='/img/xxx.png' mode="widthFix" />

webp    boolean值，默认false不解析     webP 格式，只支持网络资源
lazy-load	boolean值，默认false       图片懒加载，在即将进入一定范围（上下三屏）时才开始加载
show-menu-by-longpress	boolean值，默认false	     长按图片显示发送给朋友、收藏、保存图片、搜一搜、打开名片/前往群聊/打开小程序（若图片中包含对应二维码或小程序码）的菜单。

\ bindtap和catchtap的区别

bind事件绑定不会阻止冒泡事件向上冒泡
catch事件绑定可以阻止冒泡事件向上冒泡

\ 跳转滑动位置 wx.pageScrollTo

// 将页面视口滚动到目标位置
   wx.pageScrollTo({
       scrollTop: 1000,
       duration: 300
   })
// 小程序页面滚动事件
    onPageScroll(e) {
        console.log(e.scrollTop);
    },
// 计算标签到顶部的距离
   wx.createSelectorQuery().selectAll('.box').boundingClientRect(function (rect) {
       console.log(rect[0].top);
   }).exec()

\ 小程序修改上一个页面的数据，可用于返回传参

        let pages = getCurrentPages();
        let currPage = pages[pages.length - 1]; //当前页面
        let prevPage = pages[pages.length - 2]; //上一个页面
 
        //直接调用上一个页面对象的setData()方法，把数据存到上一个页面中去
        prevPage.setData({
            data: data
        });
        wx.navigateBack({//返回上一页
            delta: 1
        })

\ 动态设置 tabBar 某一项的内容，官方文档中还有其他好用的方法

// 不能修改路径
wx.setTabBarItem({
  index: 0,
  text: 'text',
  iconPath: '/path/to/iconPath',
  selectedIconPath: '/path/to/selectedIconPath'
})

\ 小程序分包 subpackages

    "subpackages": [
        {
            "root": "subpageA", //分包路径
            "pages": [
                "houseDetail/houseDetail", //页面路径
            ]
        },
    ]

\ 小程序拨打电话

    wx.makePhoneCall({
      phoneNumber: 110,//电话号码
    })

\ button标签的open-type - button | 微信开放文档

例：<button open-type="contact">按钮</button>
contact	        打开客服会话
share	        触发用户转发
getPhoneNumber	获取用户手机号
getUserInfo	    获取用户信息
launchApp	    打开APP
openSetting	    打开授权设置页
feedback	    打开“意见反馈”页面
chooseAvatar    获取用户头像

\ web-view 可打开网页的链接 - 需在小程序后台配置业务域名

<web-view src="{{url}}"></web-view>

\ cover-view 可覆盖原生组件 map、video、canvas、camera、live-player、live-pusher

//只支持嵌套 cover-view、cover-image、button、可覆盖​ web-view
<cover-view>
    <cover-view>内容</cover-view>
    <cover-image src="/img/123.png" />
    <button>按钮</button>
</cover-view>

\ hmtl特殊字符代码：