vue-重要方法使用
标签属性router-link-exact-active:
当页面正在方位是触发router-link-exact-active

标签router-link to=
使用a标签页面就会跳转,就不是单页面操作了,所以这里使用标签router-link to=页面不做跳转
vue-router配置路由:
<router-link to=""></router-link> | this.$router.push() 完成跳转
<router-view /> 完成页面组件的占位
在router/index.js中 完成路由配置 路径-视图组件 映射关系
两种路由传参
配置 跳转 获取
path:'/user' to="/user?pk=1" $route.query.pk
path:'/user/:pk' to="/user/1" $route.params.pk
:to="{name:'user'}" #如同Django中的路由反向解析

require配置全局样式,在main.js中配置
配置全局样式:官方提倡require加载静态文件;@就代表src文件夹的绝对路径

vue项目的生命周期:
1、启动项目,加载主脚本文件 main.js
加载Vue环境,创建根组件完成渲染
加载系统已有的第三方环境:router、store
加载自定义的第三方环境与自己配置的环境:随着项目增加不断添加
2、router被加载,就会解析router文件夹下的index.js脚本文件,完成 路由-组件 的映射关系
3、新建视图组件.vue(在views文件夹中),在路由中配置(在router的index.js中),设置路由跳转(在导航栏组件中Nav.vue)
vue钩子的生命周期
生命周期钩子:
- 1)一个组件从创建到销毁的众多时间节点回调的方法
- 2)这些方法都是vue组件实例的成员
- 3)生命周期钩子的作用就是满足在不同时间节点需要完成的事
- 组件生命周期钩子:组件从创建到销毁的整个生命周期中特殊时间节点回调的方法
created(){完成后台数据的请求} ==>(这个方法用的较多,一般在这里加载后端传到前端的数据)
mounted(){完成极其耗时的后台数据请求}
vue路由知识点概况
'''
路由知识点概况:
1)路由配置:router/index.js
2)路由跳转与路由渲染:router-link、router-view、$router.push、$router.go
3)路由传参:两种传参
'''
1、在router中

2、跳转路由


vue-重要方法使用的更多相关文章
- vue调试方法
vue调试方法有如下三种 1.chrome谷歌插件vue-devtools 2.console.log().console.error().alert().debugger 3.设置全局变量,分为两种 ...
- vue在一个方法执行完后再执行另一个方法
vue在一个方法执行完后执行另一个方法 用Promise来实现.Promise是ES6的新特性,用于处理异步操作逻辑,用过给Promise添加then和catch函数,处理成功和失败的情况 ES7中新 ...
- vue.nextTick()方法的使用详解
什么是Vue.nextTick()?? 定义:在下次 DOM 更新循环结束之后执行延迟回调.在修改数据之后立即使用这个方法,获取更新后的 DOM. 所以就衍生出了这个获取更新后的DOM的Vue方法 ...
- Vue 变异方法filter和正则RegExp对评论进行搜索
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Vue 变异方法sort&reverse对评论进行排序
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Vue 变异方法splice删除评论功能
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Vue 变异方法unshift&pop&shift
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Vue 变异方法Push的留言板实例
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- vue1——vue引入方法,npm本地安装
博客地址 :https://www.cnblogs.com/sandraryan/ Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的渐进式框架.Vue 只关注视图层, 采用 ...
- Vue——项目中接口返回值为函数回调,回调函数定义方法(Vue的方法给原生调用)
在接口调用中,有时会返回给我们一个函数回调,来自动执行我们在前端定义好的某个函数(多出现于通过回调的方式传递某个数值).在原生项目中,我们只要提供一下这个方法就好了,通过函数回调会自动执行.问题就出现 ...
随机推荐
- prometheus 监控 redis + rabbitmq
1.安装部署 1.1 wget https://github.com/oliver006/redis_exporter/releases/download/v0.15.0/redis_exporter ...
- 创建多个Fragment可滑动界面
创建新项目,选择Tabbed Activity 默认就有2个Fragment,这里我们删除相关代码. 在切换时 FragmentPagerAdapter onDestroyView onCreateV ...
- WebSocket的简单概念
本文为简单入门,主要介绍了什么是WebSocket以及其优点. 一.什么是WebSocket WebSocket的出现使得浏览器具备了实时双向通讯的能力.WebSocket是HTML5开始提供的一种浏 ...
- JavaSE基础(四)--Java基本数据类型
Java 基本数据类型 变量就是申请内存来存储值.也就是说,当创建变量的时候,需要在内存中申请空间. 内存管理系统根据变量的类型为变量分配存储空间,分配的空间只能用来储存该类型数据. 因此,通过定义不 ...
- HTTP请求方法:GET、HEAD、POST、PUT、DELETE、CONNECT、OPTIONS、TRACE 说明
平时的Rest开发,用到的都是GET,POST,PUT,DELETE类型的请求. 但Rest支持的请求类型不止前面4种,还有其他几种. 下面部分转自: https://www.html.cn/arch ...
- 关于keepalived执行后日志狂刷IPVS: Can't initialize ipvs: Protocol not available的问题
安装了keepalived+lvs,达到了高可用的负载均衡,但是今天再启用的时候发现keepalived不正常,通过 /var/log/messages 查看系统日志发现狂刷 IPVS: Can't ...
- SQLSever语句(增、删、改、查)一、增:有4种方法1.使用insert插入单行数据
SQL语句(增.删.改.查) 一.增:有4种方法 1.使用insert插入单行数据: 语法:insert [into] <表名> [列名] values <列值> 例:inse ...
- Redis 学习笔记(篇十):Sentinel
Sentinel(哨兵)是 Redis 的高可用解决方案:由一个或多个 Sentinel 实例组成的 Sentinel 系统可以监视任意多个主服务器,以及这些主服务器属下的所有从服务器,并在被监视的主 ...
- cmd寻找tomcat的命令和删除进程的命令
netstat -ano | findstr 8080taskkill -f -pid 端口 idea 异常关闭,无法启动Tomcat提示Error running ‘server_web’: Una ...
- 【树上异或和计数】czr 太弱啦
[题目]: 给一棵树,求异或和为k的路径个数. [题解]: 很遗憾比赛时做不出来,后来看别人题解做出来的.用于记录博客所用. 然后进行Dfs,得到从根节点到某一个节点的异或值,计算方案时只需要在map ...