vue重要核心精简实战代码

电玩女神 2022-12-27 08:29 126阅读 0赞

let data = {shuzi:0}
            let active 
            //这行开始vue的响应式 内部逻辑核心代码学习
            function xiangyingshi(data) {
                console.log('这里开始核心逻辑了')
                for(let key in data) {
                    let value = data[key] //对象对应的值
                    let dep = []
                    Object.defineProperty(data,key,{
                        get(){
                            console.log('我进入Object.definePropertyget里面了')
                            if(active) {
                                dep.push(active)
                            }
                            return value
                        },
                        set(newValue) {
                            console.log('我进入Object.defineProperty set里面了')
                            value = newValue
                            dep.forEach(watcher =>watcher())
                        }
                    })
                }
            }
            xiangyingshi(data)
            const watcher = (fn)=>{
                active = fn 
                fn()
                active = null
            }
            watcher(()=>{
                app.innerHTML = data.shuzi
            })
            watcher(()=>{
                console.log(data.shuzi)
            })

发表评论取消回复

表情：

评论列表（有 0 条评论，126人围观）

还没有评论，来说两句吧...

相关阅读

相关 Fastjson实战精简高效，快速上手

自我介绍：Fastjson是阿里巴巴的开源JSON解析库，它可以解析JSON格式的字符串，支持将Java Bean序列化为JSON字符串，也可以从JSON字符串反序列化到Jav

曾经终败给现在/ 2024年03月22日 09:11/ 0 赞/ 30 阅读

相关 Java代码精简之道-10条代码精简方案

场景一、Java中利用try-with-resource语句 JDK7 开始新增了对需要关闭资源处理的特殊语法 try-with-resource。所有实现C

Myth丶恋晨/ 2023年10月12日 16:05/ 0 赞/ 65 阅读

相关 java代码精简之道

java代码精简之道 1.利用语法 1.1.利用三元表达式 1.2.利用 for-each 语句

秒速五厘米/ 2023年03月14日 08:19/ 0 赞/ 25 阅读

相关 php 代码优化实例,数据库实例化操作的代码优化写法，核心种进行精简了…

数据库实例化操作的代码优化写法，核心类进行精简了…… 本帖最后由 xjl756425616 于 2013-07-16 16:59:50 编辑 class ActiveRec

小鱼儿/ 2023年01月15日 14:21/ 0 赞/ 100 阅读

相关 vue重要核心精简实战代码

let data = {shuzi:0} let active //这行开始vue的响应式内部逻辑核心代码学习

电玩女神/ 2022年12月27日 08:29/ 0 赞/ 127 阅读

相关 Java 代码精简之道

> 原文链接https://mp.weixin.qq.com/s/A1Z8YZyqQsFqK1TA1dTl2Q 1.利用语法 1.1.利用三元表达式普通

你的名字/ 2022年10月11日 01:15/ 0 赞/ 202 阅读

相关 html js精简倒计时代码

简洁实用的倒计时代码 <!doctype html> <html> <head> <meta charset="utf-

谁践踏了优雅/ 2022年06月11日 07:06/ 0 赞/ 195 阅读

相关代码精简之Lombok

JavaWeb项目开发中，JavaBean总是不可避免的出现，随之而来的就是大量的getter、setter方法，虽然大部分的开发工具（比如Eclipse等）都支持自动生成这些

素颜马尾好姑娘i/ 2022年06月08日 00:14/ 0 赞/ 198 阅读

相关 30个精简代码的技巧

前言：优化代码，一个很重要的课题。可能有些人觉得没用，一些细小的地方有什么好修改的，改与不改对代码的运行效率有什么影响呢？这个问题我是真么考虑的，好比人吃饭，吃一粒

向右看齐/ 2022年04月13日 07:58/ 0 赞/ 250 阅读

相关精简自己20%的代码

持续重构，其乐无穷。一：发现问题　　先来说如何重构业务层的try\{\}catch\{\}finally\{\}代码块，我看过很多代码，异常处理这一块大致分为两种情况，

快来打我*/ 2021年11月01日 20:32/ 0 赞/ 300 阅读