Vue beforeRouteEnter 的next执行时机
背景
今天在用vue实现界面的时候,想在beforeRouteEnter钩子函数中去获取数据,然后通过next方法设置到跳转页面的实例中,结果发现数据一直没办法在界面渲染的时候赋值,苦思不得其解,遂google之,终寻原因,记录之。
注意
beforeRouteEnter (to, from, next) {
console.log(this); //undefined,不能用this来获取vue实例
console.log('组件路由钩子:beforeRouteEnter');
next(vm => {
console.log(vm); //vm为vue的实例
console.log('组件路由钩子beforeRouteEnter的next');
});
}
next(vm=>{console.log(‘next’) })
这个里面的代码很晚执行,执行时机在组件mounted周期之后
Vue beforeRouteEnter 的next执行时机的更多相关文章
- java的static块执行时机
一.误区:简单认为JAVA静态代码块在类被加载时就会自动执行.证错如下: class MyClass1 { static {//静态块 System.out.println("static ...
- $(document).ready()与 window.onload执行时机
$(document).ready()方法和window.onload方法有相似的功能,但是在执行时机方面是有区别的.window.onload方法是子啊网页中的所有元素(包括元素的所有关联的文件)完 ...
- setTimeout/setInterval执行时机
setTimeout()和setInterval()经常被用来处理延时和定时任务.setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式,而setInterval()则可以在每隔指定的 ...
- 前端入门20-JavaScript进阶之异步回调的执行时机
声明 本系列文章内容全部梳理自以下几个来源: <JavaScript权威指南> MDN web docs Github:smyhvae/web Github:goddyZhao/Trans ...
- Android中的Sqlite中的onCreate方法和onUpgrade方法的执行时机
1.今天在做数据库升级的时候,遇到一个问题,就是onCreate方法和onUpgrade方法的执行时机的问题,这个当时在操作的时候,没有弄清楚,很是迷糊,后来看了相关的博客由于转发受限所以copy了一 ...
- Vue中父子组件执行的先后顺序
Vera Vue中父子组件执行的先后顺序探讨(转载) 前几天,朋友向我提出了一个关于Vue中父子组件执行的先后顺序问题,相信很多朋友在学习的过程中也会遇到这个问题,所以我就在此提出我自己的一些小看 ...
- MVC源码分析 - Action/Result 过滤器执行时机
前面 的篇章, 解析了Action方法的查找, 以及 Authorize, Action, Result, Error 过滤器的加载时机. 也花了两篇去看授权和错误过滤器的使用. 但是对于 Actio ...
- Java中static块执行时机
Java中static块执行时机 演示例子 在使用static进行初始化的操作,怎么也执行不了!代码如下: public class StaticDemo { public static final ...
- JavaScript进阶系列05,事件的执行时机, 使用addEventListener为元素同时注册多个事件,事件参数
本篇体验JavaScript事件的基本面,包括: ■ 事件必须在页面元素加载之后起效■ 点击事件的一个简单例子■ 为元素注册多个点击事件■ 获取事件参数 ■ 跨浏览器事件处理 □ 事件必须在页面元素加 ...
随机推荐
- Selenium WebDriver- 操作 IFrame 中的页面元素
#encoding=utf-8 import unittest import time from selenium import webdriver from selenium.webdriver i ...
- Selenium WebDriver的多浏览器测试
1. IE浏览器,需要配合下载IEDriverSever.exe的驱动程序,目前selenium支持IE9以上. (驱动程序下载链接:https://pan.baidu.com/s/1YpaUsIs1 ...
- Python学习-day6 面向对象概念
开始学习面向对象,可以说之前的学习和编程思路都是面向过程的,从上到下,一步一步走完. 如果说一个简单的需求,用面向过程实现起来相对容易,但是如果在日常生产,面向对象就可以发挥出他的优势了. 程序的可扩 ...
- 博客笔记(blog notebook)
1. 机器学习 2. NLP 3. code 实际好人 实际坏人 预测百分比 预测好人 \(p_GF^c(s_c\|G)\) \(p_BF^c(s_c\|B)\) \(F^c(s_c)\) 预测坏人 ...
- 一个TensorFlow例子
一个TensorFlow的例子 import tensorflow as tf x = tf.constant(1.0, name='input') w = tf.Variable(0.8, name ...
- 使用 Rails Webpacker 安裝 Foundation 6
動機 由於 foundation-rails 6.4.1 版本有個 Issue 目前還沒合併.加上 Rails 已經支援了 webpack 2.x.這篇文章純粹紀錄另外一種做法. 準備 開始使用之前需 ...
- pat 1037
如果你是哈利·波特迷,你会知道魔法世界有它自己的货币系统 —— 就如海格告诉哈利的:“十七个银西可(Sickle)兑一个加隆(Galleon),二十九个纳特(Knut)兑一个西可,很容易.”现在,给定 ...
- 动态方式破解apk进阶篇(IDA调试so源码)
动态方式破解apk进阶篇(IDA调试so源码) 来源 https://blog.csdn.net/qq_21051503/article/details/74907449 下面就说关于在IDA中And ...
- NOIP2017赛前模拟(3):总结
题目: 1.购买板凳(100) 大意:区间修改最后查询全局最大值; 2.新排序(40分暴力) 大意:给一串长度小于100000的数列···每次操作找出序列中严格小于其左边的数字或者严格大于其右边的数字 ...
- Echarts学习总结(一)-----柱状图
简介 ECharts,缩写来自Enterprise Charts,商业级数据图表,基于[HTML5]Canvas (ZRender),纯Javascript图表库,是百度的一个开源的数据可视化工具,业 ...