关于vue监听dom与传值问题
1. 代码初始化一次执行部分属性为空的情况
原因:
异步加载 + 立马 传值时
直接渲染 dom里面 能实时更新 (无影响)
不能直接dom中渲染(有影响) 解决方法:需要通过监听的方式来处理返回值
异步加载 + 过后点击 通过其他方法传值(如:vuex )
直接dom里面 能实时更新(无影响)
不能直接在dom中渲染(基本无影响)
异步加载 + v-if
直接dom里面 能实时更新(无影响)
不能直接在dom中渲染(无影响)
获取到vuex中的值 立马 传值问题
可以用计算属性
也可以在data中申明 然后在created 方法中取vuex中的值(直接在data里面取 是取不到的 为空 大概是渲染没那么快 从而推断出 传值也是在created 方法之后)
此步骤不为异步 所以子组件接收 计算属性跟data接收都可以

总结:父 =(异步)》子 js处理需要监听变化 而 直接传到dom中 dom本身就能实时监听
vuex getters 取值是在created 之后 传值也是在cerated之后 vuex取值不是异步
传值是否异步 直接dom中不用管 如果是js接收 并且异步的话 需要监听
关于vue监听dom与传值问题的更多相关文章
- JS监听DOM结构变化
在做一个微博的接入,需要判断微博是否被关注,要检查微博标签的DIV是否有“已关注”的字符,但这个DIV的内容是微博JSSDK动态生成.$("#id").html()是获取不到我想要 ...
- javascript 原生方法监听DOM结构改变事件
js原生方法监听DOM结构改变事件 document.addEventListener('DOMNodeInserted',function(){alert(1)},false);document.a ...
- vue监听滚动事件,实现滚动监听
在vue中实现滚动监听和原生js无太大差异,下面是一个简单的demo,可在控制台查看结果 <!DOCTYPE html> <html lang="en"> ...
- js动态监听dom变化
原生js 动态监听dom变化,根据不同的类型绑定不同的处理逻辑 // Firefox和Chrome早期版本中带有前缀 var MutationObserver = window.MutationO ...
- jQuery学习(监听DOM加载)
jQuery的extend方法 function njQuery() { } /* njQuery.extend = function (obj) { // 此时此刻的this就是njQuery这个类 ...
- vue 监听页面宽度变化 和 键盘事件
vue 监听页面窗口大小 export default { name: 'Full', components: { Header, Siderbar }, data () { return { scr ...
- MutationObserver 监听DOM树变化
1 概述 Mutation observer 是用于代替 Mutation events 作为观察DOM树结构发生变化时,做出相应处理的API.为什么要使用mutation observer 去代替 ...
- vue 监听对象里的特定数据
vue 监听对象里的特定数据变化 通常是这样写的,只能监听某一个特定数据 watch: { params: function(val) { console.log(val) this.$ajax.g ...
- Vue跨路由触发事件,Vue监听sessionStorage
近来,在做公司的聊天系统,引用的是极光的api.项目需求实时监听别人发过来的消息,进行渲染到页面,还有历史记录也要渲染,历史记录和实时聊天记录返回的结构体还不一样,看到需求的我欲哭无泪,首先登录是在首 ...
随机推荐
- 老项目用webpack中文乱码问题解决记录
有个很久(有多久呢,你还记得jquery1.6的年代吗...)的项目需要新加一些功能,又想使用新的生产力工具比如说webpack,es6,vue神马的.原来的项目整体都是用GBK编码的,这特么...坑 ...
- 牛客网 2018年东北农业大学春季校赛 L题 wyh的天鹅
链接:https://www.nowcoder.com/acm/contest/93/L来源:牛客网 时间限制:C/C++ 3秒,其他语言6秒空间限制:C/C++ 262144K,其他语言524288 ...
- redis服务意外停止
本地windows的redis一直好的,今天突然项目报错无法连接,不得解 看了下日志, [4824] 04 Mar 11:15:45.714 # Accepting client connection ...
- phpStudy 5.5n +zendstudio12.5+xDebugger的配置
1.之前一直安装zendDebugger都没装上去,用phpStudy版本转换器转到对应版本的ZendDebuger也没用,后来发现自己下载的zendstudio的php是5.5的,而且自带了zend ...
- MyBatis-Plugins
MyBatis 允许在已映射语句执行过程中的某一点进行拦截调用.默认情况下,MyBatis 允许使用插件来拦截的方法调用包括: Executor (update, query, flushStatem ...
- CentOS7 下 Hadoop 分布式部署
Hadoop 服务划分 使用三台节点,集群部署规划如下 服务\主机 hadoop1 hadoop2 hadoop3 HDFS NameNode DataNode DataNode SecondaryN ...
- Linux学习笔记:【002】ARM指令流水线
指令的处理 在CPU中,对于指令的处理一般分为: 1.取指令阶段 取指令(Instruction Fetch,IF)阶段是将一条指令从主存中取到指令寄存器的过程. 程序计数器PC中的数值,用来指示当前 ...
- Linux下main函数启动过程【程序员自我修养笔记】【自用】
1. 入口函数和程序初始化 1.1 程序从main开始吗? 当程序执行到main函数的第一行时,很多事情都已经完成了: [证1]如下是一段C语言代码: 代码中可以看到,在程序刚刚执行到main的时候, ...
- python 有趣的库练习
这里会将看到别人玩过有趣的实践并记录下来,会是一个长期更新的过程... 以下大部分均非原创变化自网络,只是觉得有趣便记录下来了,如有侵权,请告知删除... 自动化脚本... 20个必不可少的Pytho ...
- PHP 图片验证码验证
*.html <input type="> <img src="> api.php <?php session_start(); $dataObj = ...