vue2.0的常用功能简介
路由跳转
当我们想要实现点击链接跳转时,可以使用$router来进行跳转
语法如下:
this.$router.push({path:"/www",query:{id:''}})这里path是要跳转的路径,query里面是路径跳转时要携带的参数,以对象的形式存在
- 2
获取路由参数
跳转路由过后,我们可能想要获取路由上的参数,这里我们可以使用
this.$route.query.id (id为想要获取的参数)
- 3
获取当前页面的路径
想要获取当前文件的路径名称,除了原声的location.href之外,也可以利用$route来获取
this.$route.path
- 4
离开页面时弹窗
在有时候我们开发时可能为某个页面添加这样的功能就是在用户离开某个页面时进行弹窗,用来提示用户一些信息。这时候可以用到路由的导航钩子
beforeRouteLeave beforeRouteLeave(to,from,next){ //do something }, - 5
操作dom
虽然vue提倡我们尽量以数据为驱动,但是有时候我们不得不触及要操作dom,
这个使用除了原生js之外,操作dom可以使用ref直接绑定一个元素节点或者使用this.$el来操作具体的属性值。
vue2.0的常用功能简介的更多相关文章
- Beginning SDL 2.0(1) SDL功能简介
原文链接为 http://wiki.libsdl.org/Introduction. 由于近期整理音视频可视化的技术,发现好久不更新的SDL发布了2.0版本,以前也没有过于关注,这里准备尝试下.了解S ...
- vue2.0实现购物车功能
购物车功能是一件比较繁琐的事情,逻辑功能太多,今天就用vue2.0实现一个简单的购物车功能,数据都本地自己写的假数据 功能列表: 1.全选和单选结算 2.减少和增加数量 3.商品的删除 界面搭建以及布 ...
- vue2.0 事件处理常用修饰符-----------------记录,加强记忆。
1,<!-- 阻止单击事件继续传播 --> <a v-on:click.stop="doThis"></a> stop修饰符对应的是阻止冒泡的e ...
- vue2.0 练习项目-外卖APP(1)
前言 vue这个框架现在挺流行的,作为一个专注前端100年的代码爱好者,学习下路径流行的框架是必须的!在网上搜索vue的项目是比较少的,在官网进行了入门学后,没有一个项目练习巩固下,学了就等于没学,所 ...
- 完善慕课网Vue2.0购物车功能
vue一个Made in China创造出来的框架真的很66666~ 如果你是刚入门还不太懂也没有看慕课网上这门视频的,请先看一遍或许你会收获满满~ 使用vue2.0实现购物车和地址选配功能这门课程, ...
- Vue2.0实现1.0的搜索过滤器功能
Vue2.0删除了很多1.0的比较实用的过滤器,如filterBy,orderBy.官方文档给了通过计算属性实现1.0搜索过滤器功能,自己又加入了大小写通用检索功能,比较简单,学一下. <bod ...
- 关于慕课网《使用vue2.0实现购物车和地址选配功能》的总结
视频学习网址:http://www.imooc.com/learn/796 源码打包:https://codeload.github.com/fachaoshao/Vue-ShoppingCart/z ...
- 基于vue2.0打造移动商城页面实践 vue实现商城购物车功能 基于Vue、Vuex、Vue-router实现的购物商城(原生切换动画)效果
基于vue2.0打造移动商城页面实践 地址:https://www.jianshu.com/p/2129bc4d40e9 vue实现商城购物车功能 地址:http://www.jb51.net/art ...
- 管家婆软件工贸版(标准财务+进销存+生产管理)V18.0功能简介
管家婆软件工贸版(标准财务+进销存+生产管理)V18.0功能简介 管家婆 工贸版(标准财务+进销存+生产管理) 1.整体介绍 管家婆工贸版系列软件是针对国内中小型生产加工企业,将ERP管理思想与几十万 ...
随机推荐
- Spring Boot 中 Controller 使用
1.属性配置 2.Controller使用 2.@PathVariable 与 @RequestParam 的区别 (1)@PathVariable (2)@RequestParam 3.@GetMa ...
- HTTP请求响应码
① 客户方错误 100 继续 101 交换协议 ② 成功 200 OK 201 已创建 202 接收 203 非认证信息 204 无内容 205 重置内容 206 部分内容 ③ 重定向 300 多路选 ...
- 快捷键jdeveloper
alt+home:定位文件ctrl+alt+space:代码自动提示alt+enter:自动导包ctrl+x:删除ctrl+-:类搜索ctrl+=:弹出当前打开列表ctrl+shift+back:最后 ...
- 8、java内部类
一.基本介绍 内部类是指在一个外部类的内部再定义一个类.类名不需要和文件夹相同. 内部类可以是静态static的,也可用public,default,protected和private修饰:而外部顶级 ...
- grub安装的 三种安装方式
1. 引言 grub是什么?最常态的理解,grub是一个bootloader或者是一个bootmanager,通过grub可以引导种类丰富的系统,如linux.freebsd.windows等.但一旦 ...
- 搭建Weblogic服务器
安妮,我的小熊熊在ne....... 01.安全设置 service iptables stop chkconfig iptables off #关闭防火墙,只是建议,为了简便操作 setenf ...
- js图片加载效果(延迟加载+瀑布流加载)
概述 两种图片加载的效果:一种是遇到图片较多时,带读条效果的加载提示:另一种是根据滑块的位置进行预加载,用户不察觉的情况下,实现瀑布流的加载效果 详细 代码下载:http://www.demodash ...
- setting.xml配置详解
http://blog.csdn.net/uohzoaix/article/details/7035302 http://www.micmiu.com/software/build/maven-set ...
- STM32F4—fsmc的配置步骤
0:开启GPIO时钟和FSMC时钟 1:配置GPIO 2:配置片选控制寄存器 3:配置片选时序寄存器 4:配置写入时序寄存器 GPIO_InitTypeDef GPIO_InitStructure;/ ...
- Action中如何通过@Autowired自动注入spring bean ?
1.讲Action纳入spring的IOC控制 <!-- 采用注解方式自动扫描装配 --> <context:component-scan base-package="co ...