github精选：微信小程序开发技巧（12月31日更新）2016

时间 2019-11-08

标签 github 精选微信程序开发技巧 12月 31日更新栏目 Git 繁體版

原文原文链接

框架部分

全部页面都须要在 app.json 文件中注册在 pages 数组中，注册格式为："路径/文件名"html

注：文件名无需添加扩展名web
app.josn 中的 pages 数组中的第一个页面为小程序的启动页json
每一个页面的 js、json、wxml、wxss 可与所在目录名不一样，但必须具备相同的路径和文件名小程序
页面目录能够嵌套，按照页面目录在 app.json 中注册便可api
可经过直接赋值的方法修改 app.js 中的全局变量，但修改页面变量须要使用 Page.prototype.setData() 方法，且赋值数据不能超过 1024 kB数组
在文件中引入模块时，require 使用相对路径引入（绝对路径会报错）缓存
如需引入多级文件，则使用以下方式：安全

// func.js 文件中定义了两个函数 fun1 和 fun2
    fun1 = function(){
        // code
    }

    fun2 = function(){
        // code
    }

    module.export = {
        fun1: fun1,
        fun2: fun2
    }

    // util.js 中定义了函数 util 并须要导入 func.js 文件
    var funcs = require('func.js文件的相对路径')

    util = function(){
        // code
    }

    module.export = {
        fun1: funcs.fun1,
        fun2: funcs.fun2,
        util: util
    }

小程序的 wxss 中使用 @import 导入文件时应使用相对路径服务器
小程序中 wxss 样式的优先级为内联样式 > 外链样式 > 全局样式微信
小程序的 wxss 样式文件中支持 CSS3 的大部分属性，但选择器支持有限，请戳官方文档

组件部分

<block> 仅为包装元素，接受属性控制且不能嵌套不会被渲染
<text> 组件内只能嵌套使用 <text> 组件，其余不可用
仅 <text> 组件中的内容支持长按选中
<picker> 组件中的 range 数组下标必须连续且从 0 开始，不然会出现选项为 null 的状况
组件名称均为小写，全部大写的组件名称都会在渲染时转换为小写
任何自定义的组件 <自定义名称> 均会被看成 <view> 组件来渲染，但须要注意组件名称中不能出现数字。（虽然能够自定义语义化组件，可是因为微信官方并未加以说明，因此不推荐使用）
使用 page 标签选择器能够修改顶层节点的样式，至关于 HTML 中的 <body> 元素

API 部分

程序中请求、上传、下载及 websocket 的请求地址必须为 https 地址，且在当前 APPID 的微信公众平台上注册合法域名
wx.request() 中发送 POST 请求时，需设置 header 以下： {'content-type': 'application/x-www-form-urlencoded'}
某些状况下须要使用全局数据一般有两种方法：设置全局变量和写入缓存，区别在于全局变量的生存周期和小程序相同，而缓存则是永久储存的
wx.login() 只返回登录 code，可向微信服务器发送此 code 获取用户的 session_key 和 openid，微信官方提供了登录状态检验的接口和一套验证机制，请戳官方文档
小程序的本地缓存不能超过 10M
小程序的上传和下载中只能获取文件的 key，开发者在服务器端经过 key 获取文件二进制内容。

工具部分

修改 wxml 和 wxss 文件将会刷新页面
修改 js 和 json 文件将会从新编译小程序
在 app.json 文件 pages 数组中添加目标页面，将会自动生成该页面目录和所需文件
项目- 基础信息中设置勾选开发环境不校验请求安全域名以及 TLS 版本时，将可使用 http 协议的请求地址，有助于本地调试
能够在项目 - 配置信息中快捷查看当前 appid 配置的安全域名
手机调试过程当中能够点按右上角，选择 enable debug 打开手机调试模式
项目 - 预览中可添加预览页面及参数信息，跳过繁琐的前戏直达你想要操做的位置

快捷键

格式调整

Ctrl+S：保存文件

    Ctrl+[， Ctrl+]：代码行缩进

    Ctrl+Shift+[， Ctrl+Shift+]：折叠打开代码块

    Ctrl+C Ctrl+V：复制粘贴，若是没有选中任何文字则复制粘贴一行

    Shift+Alt+F：代码格式化

    Alt+Up，Alt+Down：上下移动一行

    Shift+Alt+Up，Shift+Alt+Down：向上向下复制一行

    Ctrl+Shift+Enter：在当前行上方插入一行

    Ctrl+Shift+F：全局搜索

光标相关

Ctrl+End：移动到文件结尾

    Ctrl+Home：移动到文件开头

    Ctrl+i：选中当前行

    Shift+End：选择从光标到行尾

    Shift+Home：选择从行首到光标处

    Ctrl+Shift+L：选中全部匹配

    Ctrl+D：选中匹配

    Ctrl+U：光标回退

界面相关

Ctrl + \：隐藏侧边栏

    Ctrl + m: 打开或者隐藏模拟器

概念部分

小程序基于包开发，开发和发布流程与 H5 应用是大相径庭的
小程序中 Web 开发的 session 管理部分由微信服务器实现
小程序的域名仅用于通信和验证，没有 Cookie 机制