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与传值问题的更多相关文章

  1. JS监听DOM结构变化

    在做一个微博的接入,需要判断微博是否被关注,要检查微博标签的DIV是否有“已关注”的字符,但这个DIV的内容是微博JSSDK动态生成.$("#id").html()是获取不到我想要 ...

  2. javascript 原生方法监听DOM结构改变事件

    js原生方法监听DOM结构改变事件 document.addEventListener('DOMNodeInserted',function(){alert(1)},false);document.a ...

  3. vue监听滚动事件,实现滚动监听

    在vue中实现滚动监听和原生js无太大差异,下面是一个简单的demo,可在控制台查看结果 <!DOCTYPE html> <html lang="en"> ...

  4. js动态监听dom变化

    原生js 动态监听dom变化,根据不同的类型绑定不同的处理逻辑 // Firefox和Chrome早期版本中带有前缀   var MutationObserver = window.MutationO ...

  5. jQuery学习(监听DOM加载)

    jQuery的extend方法 function njQuery() { } /* njQuery.extend = function (obj) { // 此时此刻的this就是njQuery这个类 ...

  6. vue 监听页面宽度变化 和 键盘事件

    vue 监听页面窗口大小 export default { name: 'Full', components: { Header, Siderbar }, data () { return { scr ...

  7. MutationObserver 监听DOM树变化

    1 概述 Mutation observer 是用于代替 Mutation events 作为观察DOM树结构发生变化时,做出相应处理的API.为什么要使用mutation observer 去代替 ...

  8. vue 监听对象里的特定数据

    vue  监听对象里的特定数据变化 通常是这样写的,只能监听某一个特定数据 watch: { params: function(val) { console.log(val) this.$ajax.g ...

  9. Vue跨路由触发事件,Vue监听sessionStorage

    近来,在做公司的聊天系统,引用的是极光的api.项目需求实时监听别人发过来的消息,进行渲染到页面,还有历史记录也要渲染,历史记录和实时聊天记录返回的结构体还不一样,看到需求的我欲哭无泪,首先登录是在首 ...

随机推荐

  1. Codeforces Round #523 (Div. 2) B Views Matter

    传送门 https://www.cnblogs.com/violet-acmer/p/10005351.html 这是一道贪心题么???? 题意: 某展览馆展览一个物品,此物品有n堆,第 i 堆有a[ ...

  2. go websocket

    websocket介绍 The WebSocket Protocol  RFC6455,这个是WebSocket的RFC文档,所以内容非常全面(当然只涉及协议,不涉及具体实现),不过内容太多,如果是初 ...

  3. Hadoop生态圈-Ranger数据安全管理框架

    Hadoop生态圈-Ranger数据安全管理框架 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.Ranger简介 Apache Ranger是一款被设计成全面掌握Hadoop生 ...

  4. Visual Studio连接到TFS

    我在学校自己使用git,公司使用VSS,然后这个项目又使用TFS.Visual Studio连接到TFS是这样滴 1.点连接到团队项目 2.添加TFS服务器的url,写到你的http:XXX/tfs就 ...

  5. synchronized 和lock的区别

    synchronized 是什么时候释放? 1.获取锁的线程执行完代码2.线程执行出现异常 synchronized 的缺陷? 1.Lock类可以主动释放锁.2.synchronized 是被动. R ...

  6. CSS常用选择器的认识

    ---恢复内容开始--- 前言:在CSS中选择器的种类有很多很多,但是在实际的工作中,我们经常会用到的分为两大类:基础选择器和复合选择器这两个大类,学习选择器的目的就是为了在复杂的页面中能够快速定位到 ...

  7. 【leetcode-86】 分隔链表

    (1过) 给定一个链表和一个特定值 x,对链表进行分隔,使得所有小于 x 的节点都在大于或等于 x 的节点之前. 你应当保留两个分区中每个节点的初始相对位置. 示例: 输入: head = 1-> ...

  8. Golang入门教程(三)beego 框架安装

    beego 是一个快速开发 Go 应用的 HTTP 框架,他可以用来快速开发 API.Web 及后端服务等各种应用,是一个 RESTful 的框架,主要设计灵感来源于 tornado.sinatra ...

  9. Mcafee(麦咖啡) 无法升级的解决办法(威流验证)

    McAfee时会遇到更新失败的情况.为了解决这个问题,你需要做如下设置:1.“运行”>“dcomcnfg.exe”2.双击“组件服务>计算机>我的电脑”3.展开“DCOM配置”,打开 ...

  10. 使用wget命令下载JDK失败(文件特别小)

    问题RT: 我们在网页上下载的时候要点一下 “Accept License Agreement ” ,使用wget下载的时候也需要提交这个 accept,方法如下: wget --no-check-c ...