一、解决方案:

加上异步setTimeout,延迟获取dom的代码的执行

mounted() {
// debugger
this.$nextTick(()=> {
setTimeout(()=> {
let el = document.querySelector('.table')
console.log(el)
if(el) {
// debugger
this.offsetTop = el.offsetTop
window.onscroll = () => this.getInvitationRecordUserList(this)
}
})
})
},  

  

任务:

1、搞清楚vue中dom的渲染过程

2、vue技术揭秘:深入响应式原理代码分析(https://ustbhuangyi.github.io/vue-analysis/reactive/reactive-object.html#initstate)

vue中mounted中无法获取到dom元素的更多相关文章

  1. Jquery 方式获取 iframe Dom元素

    Jquery 方式获取 iframe Dom元素 測试页面代码: <html>  <head>   <title>jquery方式,訪问iframe页面dom元素& ...

  2. JS获取HTML DOM元素的方法

    JS获取HTML DOM元素有八种方法: 1.根据id获取标签元素: document.getElementById("id名"); 2.根据标签名获取标签列表: document ...

  3. VUE中v-on:click事件中获取当前dom元素

    在开发中总是忘记, 特意在此记录 关键字:   $event     <div class="bed" v-on:click="updateBed(index,$e ...

  4. 浏览器中开发人员工具快速找到dom元素绑定那些JS事件

    在web开发过程中难免会遇到让程序员去修改一些js代码东西,例如js的ajax和php等语言的交互等,在这其中你不得不了解点js的事件触发,且随着js的盛行各种插件的事件让程序员眼花缭乱,所以借助一个 ...

  5. Html开发中document.getElementByTagName无法找到所有DOM元素的问题解决方法

    let eleList = document.querySelectorAll('li') for (let i = 0; i < eleList.length; i++) { // 遍历操作 ...

  6. 获取或操作DOM元素特性的几种方式

    1. 通过元素的属性 可以直接通过元素属性获取或操作特性,但是只有公认的特性(非自定义的特性),例如id.title.style.align.className等,注意,因为在ECMAScript中, ...

  7. JS获取HTML DOM元素的8种方法

    什么是HTML DOM 文档对象模型(Document Object Model),是W3C组织推荐的处理可扩展置标语言的标准编程接口.简单理解就是HTML DOM 是关于如何获取.修改.添加或删除 ...

  8. 原生写一个一键获取所有DOM元素的方法

    一天挺一个朋友去面试要做一个获取dom元素到数组中 主要用到一个递归算法,通过节点的childNodes属性--代码如下: function getAllNode() { var nodes = do ...

  9. 关于jq的load不用回调获取其中dom元素方法

    jq的load方法如果要操作其中的dom元素,需要使用回调,等其加载完了再进行dom元素的获取,今天看我们项目组长写的一段代码,发现不用回调也能获取到其中的元素. 具体是这样写的: <scrip ...

  10. 原生JS获取HTML DOM元素的8种方法

    JS获取DOM元素的方法(8种) 通过ID获取(getElementById) 通过name属性(getElementsByName) 通过标签名(getElementsByTagName) 通过类名 ...

随机推荐

  1. 牛客国庆集训派对Day4 I-连通块计数(思维,组合数学)

    链接:https://www.nowcoder.com/acm/contest/204/I 来源:牛客网 时间限制:C/C++ 1秒,其他语言2秒 空间限制:C/C++ 1048576K,其他语言20 ...

  2. js添加select中option

    1.js代码 $("#year").append("<option value="+value的值+">"+内容+"& ...

  3. Module Sources

    转自:https://www.terraform.io/docs/modules/sources.html 主要记录module source 的格式 The source argument in a ...

  4. skipper 内置的常用filters

    skipper 的filter 功能很强大,可做好多方便的扩展 格式: all: * -> filter1 -> filter2 -> "http://127.0.0.1: ...

  5. 对象的释放Dispose和Close对比

    C#内存释放的几个方法对比: 而Close与Dispose这两种方法的区别在于,调用完了对象的Close方法后,此对象有可能被重新进行使用:而Dispose方法来说,此对象所占有的资源需要被标记为无用 ...

  6. MySQL创建计算字段

    数据库中数据表的格式一般不是应用程序所需要的格式,如: 在一个字段中既显示公司名有显示公司地址,但这两个数据一般不在一张表中 城市,州和邮政编码在不同的列中,但邮件标签打印程序需要把他们作为一个恰当的 ...

  7. Day36 数据库的操作

    视图操作: 1.左连接查询 select * from person left join dept on person.dept_id = dept.did 2. 右连接 3. 内连接  inner ...

  8. First 1

    一,Python介绍 1,python的出生与应用 python的创始人为吉多·范罗苏姆(Guido van Rossum).1989年的圣诞节期间,吉多·范罗苏姆(中文名字:龟叔)为了在阿姆斯特丹打 ...

  9. 20165308 学习基础和C语言基础调查

    学习基础和C语言基础调查 技能学习 我认为给学生具体的, 能实践的, 能马上看到因果关系的教材和练习, 是激发学生兴趣, 好奇心, 求知欲的好方法. -- 引用自<做中学> 老师博客中注重 ...

  10. Easy to use cross-platform 3D engines

    C++ http://gamedev.stackexchange.com/questions/21/easy-to-use-cross-platform-3d-engines-for-c-game-d ...