您现在的位置是:首页 > Javascript
当前栏目
微信小程序开发入门与实战(Behaviors使用)
2023-03-14 22:44:41 时间
自定义组件 - behaviors
1、什么是 behaviors
behaviors 是小程序中,用于实现组件间代码共享的特性,类似于 Vue.js 中的 “mixins”。
2、behaviors 的工作方式
每个 behavior 可以包含一组属性、数据、生命周期函数和方法。组件引用它时,它的属性、数据和方法会被合并到组件中。每个组件可以引用多个 behavior,behavior 也可以引用其它 behavior。
3、创建 behavior
调用 Behavior(Object object) 方法即可创建一个共享的 behavior 实例对象,供所有的组件使用如 👇
module.exports=Behavior({ data:{ username:'xiaoming' }, properties:{}, methods:{ } })
4、导入并使用 behavior
在组件中,使用 require() 方法导入需要的 behavior,挂载后即可访问 behavior 中的数据或方法
如 👇
const behaviors=require("../../behaviors/behavios") // components/text4/text4.js Component({ behaviors:[behaviors], })
5、behavior 中所有可用的节点
6、同名字段的覆盖和组合规则
组件和它引用的 behavior 中可以包含同名的字段,此时可以参考如下 3 种同名时的处理规则:
① 同名的数据字段 (data)
② 同名的属性 (properties) 或方法 (methods)
③ 同名的生命周期函数
Behaviors官方教程链接
总结
① 能够创建并引用组件
全局引用、局部引用、usingComponents
② 能够知道如何修改组件的样式隔离选项
options 👉 styleIsolation( isolated, apply-shared, shared)
③ 能够知道如何定义和使用数据监听器
observers
④ 能够知道如何定义和使用纯数据字段
options 👉 pureDataPattern
⑤ 能够知道实现组件父子通信有哪3种方式
属性绑定、事件绑定、this.selectComponent(’ id或class选择器’)
⑥ 能够知道如何定义和使用behaviors
调用 Behavior() 构造器方法
最后
下篇文章再见ヾ( ̄▽ ̄)ByeBye
相关文章
- 开心档-软件开发入门之Ruby CGI方法
- antd表格组件ellipsis失效问题
- Vue v-memo 指令的使用与源码解析
- Nginx 常用的基础配置(web前端相关方面)
- 用户行为分析模型实践(三)——H5通用分析模型
- 从React源码角度看useCallback,useMemo,useContext_2023-02-07
- react源码分析:组件的创建和更新_2023-02-07
- react源码分析:深度理解React.Context_2023-02-07
- 深度:解析泰山众筹系统项目开发逻辑技术分析详细
- HTML之元素、属性、标题、段落【笔记小结】
- HTML之文本格式化、链接、头部、CSS(笔记小结)
- HTML之布局、表单、框架、颜色(笔记小结)
- 开心档-软件开发入门之CSS 网格容器
- 3D建筑设计软件首选软件Vectorworks 2023|更快的工作流和更好的设计方法
- Color Wheel Mac可直接输出Web颜色代码的取色工具:数字色轮
- React和Vue谁会淘汰谁?
- 小游戏引擎选型需要考虑哪些因素?
- 我是如何优化弹窗拖拽卡顿的?内附排查和优化过程
- 网站建设中图片优化的技巧
- 小游戏引擎选型需要考虑哪些因素?