vue中mounted中无法获取到dom元素
一、解决方案:
加上异步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元素的更多相关文章
- Jquery 方式获取 iframe Dom元素
Jquery 方式获取 iframe Dom元素 測试页面代码: <html> <head> <title>jquery方式,訪问iframe页面dom元素& ...
- JS获取HTML DOM元素的方法
JS获取HTML DOM元素有八种方法: 1.根据id获取标签元素: document.getElementById("id名"); 2.根据标签名获取标签列表: document ...
- VUE中v-on:click事件中获取当前dom元素
在开发中总是忘记, 特意在此记录 关键字: $event <div class="bed" v-on:click="updateBed(index,$e ...
- 浏览器中开发人员工具快速找到dom元素绑定那些JS事件
在web开发过程中难免会遇到让程序员去修改一些js代码东西,例如js的ajax和php等语言的交互等,在这其中你不得不了解点js的事件触发,且随着js的盛行各种插件的事件让程序员眼花缭乱,所以借助一个 ...
- Html开发中document.getElementByTagName无法找到所有DOM元素的问题解决方法
let eleList = document.querySelectorAll('li') for (let i = 0; i < eleList.length; i++) { // 遍历操作 ...
- 获取或操作DOM元素特性的几种方式
1. 通过元素的属性 可以直接通过元素属性获取或操作特性,但是只有公认的特性(非自定义的特性),例如id.title.style.align.className等,注意,因为在ECMAScript中, ...
- JS获取HTML DOM元素的8种方法
什么是HTML DOM 文档对象模型(Document Object Model),是W3C组织推荐的处理可扩展置标语言的标准编程接口.简单理解就是HTML DOM 是关于如何获取.修改.添加或删除 ...
- 原生写一个一键获取所有DOM元素的方法
一天挺一个朋友去面试要做一个获取dom元素到数组中 主要用到一个递归算法,通过节点的childNodes属性--代码如下: function getAllNode() { var nodes = do ...
- 关于jq的load不用回调获取其中dom元素方法
jq的load方法如果要操作其中的dom元素,需要使用回调,等其加载完了再进行dom元素的获取,今天看我们项目组长写的一段代码,发现不用回调也能获取到其中的元素. 具体是这样写的: <scrip ...
- 原生JS获取HTML DOM元素的8种方法
JS获取DOM元素的方法(8种) 通过ID获取(getElementById) 通过name属性(getElementsByName) 通过标签名(getElementsByTagName) 通过类名 ...
随机推荐
- 20165313 《Java程序设计》第六周学习总结
教材学习总结 一点浅见,不足之处还请谅解. 正则表达式:正则表达式是一个String对象的字符序列,该字符序列中含有具有特殊意义的字符,这些特殊字符称作正则表达式的元字符. 链表:由若干个称作结点的对 ...
- 编译Spring源码
近期,学习Spring源码.会陆续记录这次学习历程. Spring源码下载,环境中需要准备好的东西,git,gradle,eclipse (需要自己安装好) 1.Git clone Spring源码: ...
- AangularJS入门总结一
CRUD(增加Create.查询Retrieve.更新Update.删除Delete) 一.angularjs是为了克服HTML在构建应用上的不足而设计的: 二.AngularJS的出众之处: 构建一 ...
- 【传输协议】什么是CA证书
1.什么是CA证书. 看过一些博客,写的比较形象具体. ◇ 普通的介绍信 想必大伙儿都听说过介绍信的例子吧?假设 A 公司的张三先生要到 B 公司去拜访,但是 B 公司的所有人都不认识他,他咋办捏?常 ...
- 【mybatis源码学习】mybtias基础组件-反射工具
一.JavaBean的规范 类中定义的成员变量也称为字段,属性则是通过getter/setter方法得到的,属性只与类中的方法有关,与是否存在对应成员变量没有关系. 属性的getter/setter方 ...
- Python自建collections模块
本篇将学习python的另一个内建模块collections,更多内容请参考:Python学习指南 collections是Python内建的一个集合模块,提供了许多有用的集合类. namedtupl ...
- ML(4)——逻辑回归
Logistic Regression虽然名字里带“回归”,但是它实际上是一种分类方法,“逻辑”是Logistic的音译,和真正的逻辑没有任何关系. 模型 线性模型 由于逻辑回归是一种分类方法,所以我 ...
- ML(附录2)——最小二乘法
参见 :多变量微积分笔记2——最小二乘法
- Go hashcode 输入一个字符串,得到一个唯一标识码
如何输入一个字符串,得到一个唯一的hashcode? 例子如下: package main import ( "fmt" "hash/crc32" ) // S ...
- Myeclipse 配置Git详解
Myeclipse+Git EGit安装 MyEclipse已经集成了Git插件EGit,在window->Preference里搜索git可以看到. 如果没有,安装方式为Help-> ...