热点:

企业网站建设

上海网站建设

网站建设知识

seo

网络营销知识

手机网站建设知识

网站建设方案

网站优化知识

网站建设

24小时报道最新建站资讯!

主页 > 小程序开发知识 > 正文

小程序开发知识点

2020/1/25 小程序开发知识

1、浏览器、服务器、小程序之间模块组成

(1)浏览器:ES、DOM、BOM

(2)服务器:ES、native、npm

(3)小程序:ES、小程序框架、专用api


2、小程序运行环境

(1)开发环境

IDE——nwjs

(2)生产环境

android——X5内核

ios——JSC内核

PS:平台不同,环境不同,兼容性也会有差异。因此,尽量多做真机测试。


3、(1)结构——WXML

(2)样式——WXSS

(3)数据逻辑——WXS、JS


4、<wxs>标签——将外部 / 内部wxs代码,打包成一个组件对象。

用法:在标签内加入module="xxx",xxx为组件对象,而代码块暴露出来的变量,将作为该对象的属性或方法。

PS:除了module.exports外,不要用其他ES6语法。


5、在wxs代码块中,/*为结束注释,后面的代码不会执行。


6、小程序框架——MINA框架






未标题-2.png




特点:

(1)双线程

(2)WXML、WXSS、WXS都在ui线程中运行

(3)逻辑层通过page.setData(obj)方法,向视图层传递需要更新的数据


7、启动方式

(1)冷启动——第一次启动、5分钟后再启动、两次警告后再启动(被微信销毁了)

(2)热启动——5分钟内启动

PS:若启动时,小程序有新版本,会异步加载内容,默认下次启动时替换为新版本,但是可以使用某api功能,达到立即替换为新版本。


8、资源加载流程






未标题-2.png




特点:

(1)本地缓存

(2)CDN内容分发网络

(3)ajax


9、生命周期事件——程序生命周期、页面生命周期

程序生命周期:

(1)onLaunch:初始化完成

(2)onHide:收起小程序到后台

(3)onShow:展开小程序到前台(热启动)

(4)onError:程序出错

PS:globalData——全局数据

页面生命周期:

(1)onLoad:页面冷启动后,初次加载(只有一次)

(2)onShow:每次切换页面,在之后的页面中触发

(3)onReady:页面被首次切换到(每个页面只有一次)

(4)onHide:每次切换页面,在之前的页面中触发

(5)onUnload:关闭当前页

PS:data——页面数据






QQ截图20190125011431.png


10、指令渲染写法(如wx: if或者wx: for)

(1)单个渲染——直接在标签内部写

(2)多个——用block包裹,在block写


11、wxml文件导入

(1)<import/>——只导入目标文件中的模板,而间接的模板不会导入

(2)<include/>——导入目标文件中,除了模板的全部内容,间接的模板也会导入


12、<text>支持转义字符


13、<rich-text>——通过html、css的方式,渲染出wxml、wxss的内容。


14、在app.json的pages数组中,写页面路径的同时,会在该位置自动生成相应系列文件。


15、存储数据

视图层——dataset,自定义属性

逻辑层——data对象


16、其他内容

(1)project.config.json——保存环境配置,防止换电脑跑不了项目。

(2)其他json——保存页面配置,而app.json负责整个小程序的配置(操盘手)。

(3)js——应用级JS、页面级JS,分别具有应用级、页面级的生命周期事件。

(4)utils文件夹——存放共用工具类,如常用的函数。


17、页面而言,除了基本的生命周期事件外,还具备丰富的交互事件,如上下拉、滚动、分享、tab切换。

PS:若不设置分享函数,则右上角按钮中,菜单会没有转发功能。而且,分享函数可以返回一个对象,为分享窗口提供自定义标题、描述,以及带参的转发路径。


18、页面路由

概念:以栈的形式,管理页面的历史记录。

注意点:

(1)重定向:前一个页面出栈。

(2)tab切换、重新加载:之前所有页面出栈。

(3)进栈onLoad,出栈onUnload。

(4)栈存放页面数量,不能超过5个。


19、注意回调时,this指向会产生变化。

解决措施:

(1)私有变量保存this。

(2)ES6语法。


20、逻辑层数据

(1)this.data.xxx——只关注逻辑层,数据不传递到视图层。

(2)this.setData(obj)——更改逻辑层的同时,会将数据传递到视图层,但是单次设置不要超过1M。


21、插值表达式(双花括号)

(1){{ }}内部可以放入data中的变量,也可以是任何表达式。

(2)安放位置:特性值、标签之间。


22、列表渲染时,没有设置key的话,会有警告。若是静态列表,无需强求,但强迫症例外。


23、模板管理:在pages文件夹下,新开一个template文件夹,存放不同类型的模板,便于管理。


24、标签组件

学习方法:多看文档,对各组件的特性有大致了解。

注意点:

(1)input组件不能设置字体类型。


25、页面带参跳转

(1)旧页面:在url中,拼接字符串。

(2)新页面:onLoad()会接收一个装载参数的对象。


26、性能优化

https://developers.weixin.qq.com/miniprogram/dev/framework/performance/tips.html


27、事件绑定

(1)冒泡流(子到父)

bind(xxx)——冒泡

catch(xxx)——不冒泡

(2)捕获流(父到子)

capture-bind:xxx——捕获,再冒泡

capture-catch:xxx——捕获到位后,停在该位置,不冒泡


28、自动预览

开发者工具中,具备自动预览功能,让手机与电脑实时通讯,不必每次调试都要扫码,不过一定要先保存,再进行编译预览。


29、真机调试

(1)与预览相比,真机调试提供详细的监控信息。

(2)某些设备不支持部分API,因此真机调试更可靠。


30、WXSS不能获取本地资源,如background。

以上是关于“小程序开发知识点”的介绍,如需开发小程序小程序建设,推荐小程序开发服务商银狐动力:http://www.infoo.cn 热线:4007203721

TAG: 高压电磁阀 上海迪士尼快速通道 高压反应釜 回收中央空调 工作服团体定制 振动传感器 中央空调回收 旋臂吊 电动推杆 液压试验台

特别推荐—上海网站建设服务商


热门标签