微信小程序自定义组件的计算属性功能
1、behavior.js
module.exports = Behavior({lifetimes: {created() {this._originalSetData = this.setData // 原始 setDatathis.setData = this._setData // 封装后的 setData}},definitionFilter(defFields) {const computed = defFields.computed || {}const computedKeys = Object.keys(computed)const computedCache = {}// 计算 computedconst calcComputed = (scope, insertToData) => {const needUpdate = {}const data = defFields.data = defFields.data || {}for (let key of computedKeys) {const value = computed[key].call(scope) // 计算新值if (computedCache[key] !== value) needUpdate[key] = computedCache[key] = valueif (insertToData) data[key] = needUpdate[key] // 直接插入到 data 中,初始化时才需要的操作}return needUpdate}// 重写 setData 方法defFields.methods = defFields.methods || {}defFields.methods._setData = function (data, callback) {const originalSetData = this._originalSetData // 原始 setDataoriginalSetData.call(this, data, callback) // 做 data 的 setDataconst needUpdate = calcComputed(this) // 计算 computedoriginalSetData.call(this, needUpdate) // 做 computed 的 setData}// 初始化 computedcalcComputed(defFields, true) // 计算 computed}
})
2、use.js
const beh = require('./behavior.js')
Component({behaviors: [beh],data: {a: 0,},computed: {b() {return this.data.a + 100},},methods: {onTap() {this.setData({a: ++this.data.a,})}}
})
微信小程序自定义组件的计算属性功能相关推荐
- 微信小程序自定义组件(二)
微信小程序自定义组件 ps 由于作业部落貌似出了点问题,耽误了点时间,找了一个stackedit.io准备写.无奈,这是要自己建编辑器的节奏啊.没有一个能靠的注 为何存在组件 组件间的关系 使用rel ...
- 基于canvas 2D实现微信小程序自定义组件-环形进度条
基于canvas 2D实现微信小程序自定义组件-环形进度条 最近开发一个小程序项目博闻金榜答题小程序,需要使用到一个可以显示答题倒计时的组件,基于进度条实现,下面就主要介绍基于canvas2D实现一个 ...
- 微信小程序自定义组件,提示组件
微信小程序自定义组件,这里列举了一个常用的提示自定义组件,调用自定义组件中的方法和字段.仅供参考和学习. 编写组件: 在根目录下添加"components"目录,然后像添加Page ...
- 微信小程序--自定义组件(超详细 从新建到使用)
微信小程序–自定义组件 微信小程序官网介绍! 本文提供给急需使用自定义组件人群,以下是博主个人理解和案例!可以辅助官网来看 介绍: 从小程序基础库版本 1.6.3 开始,小程序支持简洁的组件化编程.所 ...
- 微信小程序自定义组件子传父详解(多图)
微信小程序自定义组件子传父详解 前言: 刚开始为了测试父传子,所以把页面的数组放在了父组件中 1. 然而子组件中绑定的自定义点击事件依然放在子组件的js文件中 2. 所以就会出现我们点击页面的文字能改 ...
- 微信小程序自定义组件的基本使用
微信小程序自定义组件的基本使用 组件与模块类似,实现了功能的复用,提高开发速率,减少代码量 在开发过程中 , 总会遇到一些功能板块是相同或很类似的 .如两个不同页面都有搜索框 , 或者 导航栏等 . ...
- 微信小程序自定义组件-树形数据表格(进阶版)
前言 一.下载引用 二.使用treegrid组件 三.使用文档 属性 事件 四.组件源码 利用递归思想编写的表格行--treegrid-treeline 树形表格--treegrid-treegrid ...
- 小程序组件onload_微信小程序自定义组件(一)
好吧,突然发现学不完了,一下子,那就分开吧,由于时间太久,直接重新大致复习了一下 微信小程序自定义组件 微信小程序支持自定义组件 下方的目录 其中,components为组件目录,nodemodule ...
- 一步步教你实现微信小程序自定义组件
一步步教你实现微信小程序自定义组件 更新时间:2022年03月21日 11:12:34 作者:naluduo233 之前做小程序开发的时候,对于开发来说比较头疼的莫过于自定义组件了,下面这篇文章主 ...
最新文章
- 10款WordPress的插件让你的网站的移动体验
- iPhone开发教程之Core Data 常见问题的总结
- leetcode--121. 买卖股票的最佳时机
- handler原子锁_Linux的原子操作与同步机制
- 了解动态代理:Spring AOP基础
- 关于share prefrences功能的一些理解
- 《云计算:原理与范式》一3.10 企业对企业集成服务
- JavaScript文档对象模型概述(1)
- VS-C++ 调试----调试信息输出至调试器(输出界面)
- win8.1虚拟机装linux,Linux VirtualBox安装Win8.1报错0x000000C4怎么办?
- scsi接口服务器硬盘转速,服务器硬盘接口SCSI结构、特点详解
- Failed to introspect annotated methods on class 异常
- Gazebo手册:【1】gazebo基本操作案例
- 牛客网小白二(2018.4.21)
- 麒麟V10SP1高级服务器版本操作系统离线安装docker容器技术
- php采集今日头条出现问题,PHP采集今日头条内容页时,解析页面上的JS转为json
- Linux 命令 ps
- PDF合并、分割、转换等功能—免费工具
- 中级工程师专业有哪些?职称申报有哪些要求?伴德诚
- OC--Foundation--数组