开发微信小程序必看（渲染HTML，动态二维码）

一.前言：

最近公司要作一个小程序，以前也没接触过，可是用过Vue框架，就直接上手了，毕竟思想是很像的。
可是微信小程序的坑仍是有的，今天就讲一下思路，若是有需求能够出详细的文章。有错的地方请你们纠正。

二. 微信限制

• 说下微信的限制

  • 下面切换的tab不能超过5个
  • 父页面和子页面的关系不能超过5个
  • 上线打包后的文件不能超过2M
  • 不容许跳转第三方连接（这个很重要，致使不少功能实现不了）
  • 不能给按钮直接下载APP
  • 内嵌H5只能展现，不能对其进行操做
  • 小程序里面没有DOM
  • 小程序不能用本地的图片作背景图

三. 遇到的难点

• 渲染HTML

  • ​​问题：后台给我返回HTML的代码，让我在小程序里渲染
  • 难点：小程序不支持DOM
  • 方案：大神写的 wxParse 能够渲染DOM节点 ​https://github.com/icindy/wxP...

• 二维码生成

  • 问题：要根据后台给的URL动态生成二维码
  • 难点：小程序不支持DOM
  • 方案：大神写的 qrcode https://github.com/yingye/wea...

• 微信API问题

  • 问题：微信的下载文件的API有问题 ​`wx.downloadFile（）` PC上能够用，移动端用不了，并且URL还要用一个域名下
  • 方案：由于咱们是要下载图，微信有一个预览图片的API，这个长按能够下载 wx.previewImage（）图片

• template模板的使用注意点

  • 使用：

    1. App.json文件里不能引入模板文件 如：page/template/teplate

    2. 在父页面的 wxml和wxss文件引入template想对应的wxml和wxss文件

       Wxml文件：
       ​<import src="../tampmask/tampmask.wxml" />

       <template is="tampmask" data="{{show}}”/>

       注意上面结束便签的两个斜杠！！

       对应的tampmask模板：

       `<template name="tampmask"></template> `

       WXss文件：

       ​ @import '../tampmask/tampmask.wxss’;

       js文件：

       ​模板里的template.js是不会渲染到 template.js要`写在引入模板文件上面`

• ​为了不错误，引号尽可能有双引号。
• {{}}里不能用toFixed()等函数，要先在js里转化，再在{{}}里渲染
• 在子页面是能够设置全局的变量的，引入APP（）这个对象
• 微信是能够实现下拉刷新的功能的，微信是有下拉的API的，能够经过获取的值来显示隐藏刷新

四.构建意见

• 若是内嵌H5 的页面比较多，不要每一个页面都写一个页面，一个模块引入一个<web-view>文件，在根据传进来的值判断显示哪一个，不然会很乱
• 样式能够引入weui库，契合微信的样式
• 关于登陆注册，微信能够直接获取手机号码，不用特意弄个登陆注册页
• 判断是否登陆的值能够放在全局的变量里，也能够放在localstroge里面（可是建议放在全局变量里面）。
• 关于模板，一个把全部模板写在同一个template文件下面，不用写多个，用不一样的name来区分和引用，这样比较清晰，便于管理

谢谢你们，若是有问题能够一块儿探讨

blog:http://blog.beastxw.wang/2019...