vue中关于dom的操作


mounted
个人理解为DOM结构准备就绪了,可以开始加载vue数据了,
挂载点,配合使用
mounted:function(){
this.$nextTick(function(){ //this.$nextTick是在下次DOM更新循环结束时调用延迟回调函数。异步函数
this.loadData(); //DOM加载就绪,后调用loadData方法进行数据更新
//想要更新后的获取dom //此时若获取更新后dom数据将会报错,数据为undefined;
})
}
此时,若想要获取更新后的dom结构,并操作dom,必须在下一个钩子函数中获取,否则将会报错,获取不到
updated
数据更新导致的dom结构更新,在更新完之后会调用这个钩子
在此时获取上一步中更新的数据,就可以成功获取到。
引用插件的方法,在mounted钩子中加载数据,在updated钩子引用处理这个数据的插件。
beforecreate : 举个栗子:可以在这加个loading事件
created :在这结束loading,还做一些初始化,实现函数自执行
mounted : 在这发起后端请求,拿回数据,配合路由钩子做一些事情
updated: 在这里处理更新后的数据
beforeDestory: 你确认删除XX吗? destoryed :当前组件已被删除,清空相关内容
vue中关于dom的操作的更多相关文章
- [记录] Vue中的dom操作
使用过Vue的同学都应该有这样一个感觉,在vue中页面是基于数据驱动的,不需要我们自己操作dom,框架帮我们完成了这一步,事实上Vue官方也建议我们这样做 在绝大多数情况下是不需要操作dom就可以完成 ...
- Vue中 等待DOM或者数据完成 在执行 --this.$nextTick()
虽然 Vue.js 通常鼓励开发人员沿着“数据驱动”的方式思考,避免直接接触 DOM,但是有时我们确实要这么做.比如一个新闻滚动的列表项.如果在这里需要操作dom, 应该是等待 Vue 完成更新 DO ...
- Vue中获取dom元素
Vue.js虽然说是数据驱动页面的,但是有时候我们也要获取dom对象进行一些操作. vue的不同版本获取dom对象的方法不一样 Vue.js 1.0版本中,通过v-el绑定,然后通过this.els ...
- 第七十六篇:ref引用(在vue中引用Dom的方法)
好家伙, 引子: jQuery简化了程序员操作DOM的过程 vue 优势:MVVM 在vue中,程序员不需要操作DOM.程序员只需要把数据维护好即可!(数据驱动视图) 那么若要在vue中操作dom,这 ...
- Vue中对data的操作
1. {{a}} var vm = new Vue({ el: '#app', data: { a: { a: 1, b: 2 } } }) vm.a.c = 'sadoisad' // 按理说是 ...
- Vue中的DOM操作
1.在要获取的标签中添加 ref="xx" 示例: <button ref="btn">一个按钮</button> 2.在 mounte ...
- vue中的dom指令控制
一.条件控制指令1.v-if,条件渲染 <div id="J_app"> <p v-if="show">显示该标签</p> ...
- vue中一个dom元素可以绑定多个事件?
其实这个问题有多个解决方法的 这里提出两点 第一种 第二种 现在dom上绑定一个 然后在你的methods中直接调用 如果要传参数 这时候千万别忘记 原创 如需转载注明出处 谢谢
- 058——VUE中vue-router之实例操作新闻列表单页面应用与路由别名的使用
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
随机推荐
- iis 发布mvc
转载地址:https://www.cnblogs.com/Leo_wl/p/3866625.html
- python任意进制转换
python任意进制转换 import string def module_n_converter(q, s, base=None): """ 将自然数按照给定的字符串转 ...
- Python中删除easy_install安装的包
网上查了一大圈,终于在官网上找到了.记一下,备忘...
- Collision (hdu-5114
题意:你有一个以(0, 0), (x, 0), (0, y), (x, y)为边界点的四边形,给你两个点从(x1, y1), (x2, y2)的点发射,以(1, 1)的速度走,碰到边界会反射,问你最终 ...
- [预打印]使用vbs给PPT(包括公式)去背景
原先博客放弃使用,几篇文章搬运过来 在 视图—>宏 内新建宏 '终极版 Sub ReColor() Dim sld As Slide Dim sh As Shape For Each sld I ...
- 定时任务 Wpf.Quartz.Demo.5 (升级版)
老规矩:先把全部源码上传,见本文底部. 相对于Demo3的区别,就是能自动加载继承了IJob的任务,任务主体程序分离. 在exe执行文件的同级下建一个MyJobs的文件夹,每次会自动扫描该文件夹下的J ...
- WPF 开机注册自启动及设置确保以管理员运行
最近用到开机自启动设置,在此记录下设置自启动的步骤,如果对各位有需要可以借阅,之前设置管理权限解释在创建解决方案是将VS以管理员方式打开,这种方法可以实现,但是个人还是偏向与本文的方式,不多说啥了,下 ...
- PICE(6):集群环境里多异类端点gRPC Streaming - Heterogeneous multi-endpoints gRPC streaming
gRPC Streaming的操作对象由服务端和客户端组成.在一个包含了多个不同服务的集群环境中可能需要从一个服务里调用另一个服务端提供的服务.这时调用服务端又成为了提供服务端的客户端了(服务消费端) ...
- 你不知道的javascript读书笔记3
概述 这是我看<你不知道的JavaScript(中卷)>中关于类型检查的笔记,供以后开发时参考,相信对其他人也有用. typeof 我们知道js中有七种内置类型:undefined, nu ...
- 你不知道的console调试
概述 浏览器的开发者工具我们经常用,console.log我们也经常用,但是console还有其它一些方便调试的命令,我总结了几个常用的记录在下面,供以后开发时参考,相信对其他人也有用. 获取js执行 ...