js实现变量监听

    //定义一个对象,挂载到window下,后续在任何模块中,给这个对象的show属性赋值,都将触发set对应的代码,我这么写主要是为了解决vue子组件向父组件传值的问题
window.mlistener={}
let _this = this
Object.defineProperty(mlistener,'show',{
set: function(val){
_this.showHeader = val
_this.showFoot = val
}
})

window变量触发vue渲染

可保持window变量,跟vue用到的变量同步更新

//将window赋值给vue变量
data() {
return {
tableH: ,
isShow: true,
filterText: '',
window: window,
tree_data: [],
expendKeys: [],
defaultProps: {
children: 'children',
label: 'label'
}
} //用法
{{window.getTest()}} //getTest()
window.getTest = ()=>{
console.dir(this.fullScreen)
return this.fullScreen
}

结果

参考

js监听一个变量的变化

window跟vue变量互相绑定的更多相关文章

  1. Vue.js双向绑定的实现原理和模板引擎实现原理(##########################################)

    Vue.js双向绑定的实现原理 解析 神奇的 Object.defineProperty 这个方法了不起啊..vue.js和avalon.js 都是通过它实现双向绑定的..而且Object.obser ...

  2. vue的双向绑定原理及实现

    前言 使用vue也好有一段时间了,虽然对其双向绑定原理也有了解个大概,但也没好好探究下其原理实现,所以这次特意花了几晚时间查阅资料和阅读相关源码,自己也实现一个简单版vue的双向绑定版本,先上个成果图 ...

  3. 探讨vue的双向绑定原理及实现

    1.vue的实现原理 vue的双向绑定是由数据劫持结合发布者-订阅者模式实现的,那么什么是数据劫持?vue是如何进行数据劫持的?说白了就是通过Object.defineProperty()来劫持对象属 ...

  4. 【Vue】vue的双向绑定原理及实现

    vue数据双向绑定是通过数据劫持结合发布者-订阅者模式的方式来实现的,那么vue是如果进行数据劫持的,我们可以先来看一下通过控制台输出一个定义在vue初始化数据上的对象是个什么东西. 代码: var ...

  5. [js高手之路] vue系列教程 - vue的事件绑定与方法(2)

    一.在vue中,绑定事件,用v-on:事件类型, 如绑定一个点击事件, 我们可以这样子做 window.onload = function () { var c = new Vue({ el : 'b ...

  6. 西安电话面试:谈谈Vue数据双向绑定原理,看看你的回答能打几分

    最近我参加了一次来自西安的电话面试(第二轮,技术面),是大厂还是小作坊我在这里按下不表,先来说说这次电面给我留下印象较深的几道面试题,这次先来谈谈Vue的数据双向绑定原理. 情景再现: 当我手机铃声响 ...

  7. Vue数据双向绑定原理及简单实现

    嘿,Goodgirl and GoodBoy,点进来了就看完点个赞再go. Vue这个框架就不简单介绍了,它最大的特性就是数据的双向绑定以及虚拟dom.核心就是用数据来驱动视图层的改变.先看一段代码. ...

  8. vue数据双向绑定原理

    vue的数据双向绑定的小例子: .html <!DOCTYPE html> <html> <head> <meta charset=utf-> < ...

  9. 揭密 Vue 的双向绑定

    Vue 中需要输入什么内容的时候,自然会想到使用 <input v-model="xxx" /> 的方式来实现双向绑定.下面是一个最简单的示例 剖析Vue原理& ...

随机推荐

  1. [国家集训队]排队 [cdq分治]

    题面 洛谷 和动态逆序对那道题没有什么区别 把一个交换换成两个删除和两个插入 #include <cstdio> #include <cstdlib> #include < ...

  2. JXOI2017颜色

    题面 loj 分析 这道题非常妙啊 对于可保留区间[l, r] 枚举右端点r 考虑l的取值范围有两重约数 记颜色i出现的最右侧位置是\(max_i\) 最左侧位置是\(min_i\) r前最后一次出现 ...

  3. ElasticSearch5.4.1 搜索引擎搭建文档

    安装配置JDK环境JDK安装(不能安装JRE)JDK下载地址:http://www.oracle.com/technetwork/java/javase/downloads/jdk8-download ...

  4. Nginx log日志参数详解

    $args #请求中的参数值$query_string #同 $args$arg_NAME #GET请求中NAME的值$is_args #如果请求中有参数,值为"?",否则为空字符 ...

  5. HR_Hash Tables: Ransom Note

    1 题目重点:whole words | case-sensitive #!/bin/python3 import math import os import random import re imp ...

  6. Luogu P1648 看守

    Luogu P1648 看守 题意简述 有n个d维的点,输出这些点两两之间曼哈顿距离中的最大值 数据范围 n<=1e6,d<=4 思路 暴力?时间复杂度O(\(n^2d\)) 考虑这样的一 ...

  7. POJ--3259 Wormholes (SPFA判负环)

    题目电波   3259 Wormholes #include<iostream> #include<cstring> #include<algorithm> #in ...

  8. java 各种数据类型判断为空

    一,基本数据类型 八种基本类型有默认值 http://www.runoob.com/java/java-basic-datatypes.html 二,String 对象 // 判断String为空 / ...

  9. LOJ#2245 魔法森林

    这道题以前zbtrs大佬给我讲过.但是我只知道思想,不知道要lct维护... 这个套路很常见. 题意:给你一个无向图,每条边有a,b两个权值.求1到n号点的一条路径,路径的权值是每条边的最大a与最大b ...

  10. win32: WM_PAINT 实现双缓冲缓图

    相关参考资料: GDI下实现双缓冲 - http://jingyan.baidu.com/article/e73e26c0f8df2424acb6a76e.html <Win32_19>用 ...