1. 路由跳转

    当我们想要实现点击链接跳转时,可以使用$router来进行跳转

    语法如下:

    this.$router.push({path:"/www",query:{id:''}})

    这里path是要跳转的路径,query里面是路径跳转时要携带的参数,以对象的形式存在

  2. 2

    获取路由参数

    跳转路由过后,我们可能想要获取路由上的参数,这里我们可以使用

    this.$route.query.id  (id为想要获取的参数)
    
  3. 3

    获取当前页面的路径

    想要获取当前文件的路径名称,除了原声的location.href之外,也可以利用$route来获取

    this.$route.path
    
  4. 4

    离开页面时弹窗

    在有时候我们开发时可能为某个页面添加这样的功能就是在用户离开某个页面时进行弹窗,用来提示用户一些信息。这时候可以用到路由的导航钩子

    beforeRouteLeave
    
    beforeRouteLeave(to,from,next){
    
    //do something
    
    },
    
  5. 5

    操作dom

    虽然vue提倡我们尽量以数据为驱动,但是有时候我们不得不触及要操作dom,

    这个使用除了原生js之外,操作dom可以使用ref直接绑定一个元素节点或者使用this.$el来操作具体的属性值。

vue2.0的常用功能简介的更多相关文章

  1. Beginning SDL 2.0(1) SDL功能简介

    原文链接为 http://wiki.libsdl.org/Introduction. 由于近期整理音视频可视化的技术,发现好久不更新的SDL发布了2.0版本,以前也没有过于关注,这里准备尝试下.了解S ...

  2. vue2.0实现购物车功能

    购物车功能是一件比较繁琐的事情,逻辑功能太多,今天就用vue2.0实现一个简单的购物车功能,数据都本地自己写的假数据 功能列表: 1.全选和单选结算 2.减少和增加数量 3.商品的删除 界面搭建以及布 ...

  3. vue2.0 事件处理常用修饰符-----------------记录,加强记忆。

    1,<!-- 阻止单击事件继续传播 --> <a v-on:click.stop="doThis"></a> stop修饰符对应的是阻止冒泡的e ...

  4. vue2.0 练习项目-外卖APP(1)

    前言 vue这个框架现在挺流行的,作为一个专注前端100年的代码爱好者,学习下路径流行的框架是必须的!在网上搜索vue的项目是比较少的,在官网进行了入门学后,没有一个项目练习巩固下,学了就等于没学,所 ...

  5. 完善慕课网Vue2.0购物车功能

    vue一个Made in China创造出来的框架真的很66666~ 如果你是刚入门还不太懂也没有看慕课网上这门视频的,请先看一遍或许你会收获满满~ 使用vue2.0实现购物车和地址选配功能这门课程, ...

  6. Vue2.0实现1.0的搜索过滤器功能

    Vue2.0删除了很多1.0的比较实用的过滤器,如filterBy,orderBy.官方文档给了通过计算属性实现1.0搜索过滤器功能,自己又加入了大小写通用检索功能,比较简单,学一下. <bod ...

  7. 关于慕课网《使用vue2.0实现购物车和地址选配功能》的总结

    视频学习网址:http://www.imooc.com/learn/796 源码打包:https://codeload.github.com/fachaoshao/Vue-ShoppingCart/z ...

  8. 基于vue2.0打造移动商城页面实践 vue实现商城购物车功能 基于Vue、Vuex、Vue-router实现的购物商城(原生切换动画)效果

    基于vue2.0打造移动商城页面实践 地址:https://www.jianshu.com/p/2129bc4d40e9 vue实现商城购物车功能 地址:http://www.jb51.net/art ...

  9. 管家婆软件工贸版(标准财务+进销存+生产管理)V18.0功能简介

    管家婆软件工贸版(标准财务+进销存+生产管理)V18.0功能简介 管家婆 工贸版(标准财务+进销存+生产管理) 1.整体介绍 管家婆工贸版系列软件是针对国内中小型生产加工企业,将ERP管理思想与几十万 ...

随机推荐

  1. java各种框架的比较,分析

    Spring 框架 优点 1.提供了一种管理对象的方法,可以把中间层的对象有效地组织起来 2.采用了分层结构,可以增量引入到项目中. 3.代码测试较容易 4.非侵入性,应用程序对Spring API的 ...

  2. java Socket Udp聊天

    import java.io.BufferedReader;import java.io.IOException;import java.io.InputStreamReader;import jav ...

  3. MassiGra045 简体中文化|打开图片很快

    MassiGra045 简体中文化,是一款对图片的打开预览很高效的工具,据传是日本开发的. 本人之前一直使用,唯一有点缺点就是不能旋转图片. 图片预览 峰回路转: http://pan.baidu.c ...

  4. Android网络开发之HttpClient

    Apache提供HttpClient,它对java.net中的类做了封装和抽象,更适合在Android上开发应用. HttpClient应用开发几个类: 1. ClientConnectionMana ...

  5. MSSQL-SQL SERVER还原与备份(导入与导出)

    备份: 使用Microsoft SQL Server Management Studio查询出想要的列和结果, 在结果处左上角点击, 软件会自动选中查询出的所有结果, 然后右键"将结果另存为 ...

  6. Mint17 一些安装备忘

    1,中文输入法: sudo apt-add-repository ppa:fcitx-team/dailybuild-fcitx-master sudo apt-get update sudo apt ...

  7. 照片管家iOS-实现本地相册、视频、安全保护、社交分享源码下载Demo

    <照片管家> APP功能: 1.本地照片批量导入与编辑 2.本地视频存储与播放 3.手势密码.数字密码.TouchID安全保护 4.QQ.微信.微博.空间社交分享 5.其他细节功能. 运用 ...

  8. map reduce相关程序

    Test_1.java /** * Hadoop网络课程模板程序 * 编写者:James */ import java.io.IOException; import java.text.DateFor ...

  9. VMWare安装Linux系统之CentOS-6.6操作方法。

    1.使用VMWare创建新的虚拟主机 2.使用VMWare安装Linux,点击“开启虚拟主机” 3.进入Linux安装界面,选择第一项"Install or upgrade an exist ...

  10. ASP.NET MVC下的异步Action的定义和执行原理[转]

    http://www.cnblogs.com/artech/archive/2012/06/20/async-action-in-mvc.html Visual Studio提供的Controller ...