【小程序】学习笔记二 - 小程序指南篇2 自定义组件

----------------------------------------------------------------------

笔记整理自微信小程序官方文档,目的加深印象,以及日后快速查询 

https://developers.weixin.qq.com/miniprogram/dev/framework/

----------------------------------------------------------------------

 

https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/

创建自定义组件

使用自定义组件

 

https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/wxml-wxss.html

组件模板和样式

自基础库版本2.0.9开始,还可以在数据中包含函数(但这些函数不能在 WXML 中直接调用,只能传递给子组件)。

默认情况下,一个组件的wxml中只能有一个slot。需要使用多slot时,可以在组件js中声明启用。

 

https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/events.html

组件间通信与事件

自定义组件触发事件时,需要使用 triggerEvent 方法,指定事件名、detail对象和事件选项

 

https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/behaviors.html

behaviors

组件引用时,在 behaviors 定义段中将它们逐个列出即可。

自定义组件可以通过引用内置的 behavior 来获得内置组件的一些行为。

 

https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/relations.html

组件间关系

自定义组件,如果它们有相互间的关系,相互间的通信往往比较复杂,此时在组件定义时加入 relations 定义段,可以解决这个问题

(注意:必须在两个组件定义中都加入relations定义,否则不会生效。)

 

https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/observer.html

数据监听器

  • 数据监听器监听的是 setData 涉及到的数据字段,即使这些数据字段的值没有发生变化,数据监听器依然会被触发。
  • 如果在数据监听器函数中使用 setData 设置本身监听的数据字段,可能会导致死循环,需要特别留意。
  • 数据监听器和属性的 observer 相比,数据监听器更强大且通常具有更好的性能

 

 

https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/pure-data.html

纯数据字段

纯数据字段是一些不用于界面渲染的 data 字段,可以用于提升页面更新性能。从小程序基础库版本 2.8.2 开始支持。

注意:属性中的纯数据字段的属性 observer 永远不会触发!如果想要监听属性值变化,使用 数据监听器 代替。

 

https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/generics.html

抽象节点

节点的 generic 引用 generic:xxx="yyy" 中,值 yyy 只能是静态值,不能包含数据绑定。因而抽象节点特性并不适用于动态决定节点名的场景。

 

https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/extend.html

自定义组件扩展【有点绕,需要多试验】

 

 

 

 

【小程序】学习笔记二 - 小程序指南篇2 自定义组件

上一篇:微信小程序自定义选项卡


下一篇:web前端学习115-119(CSS的背景)