1、用点击函数

 <button  class="btntop" @click="gootherpage">跳转页面</button>

函数

gootherpage(){
this.$router.push('/FileDetail')
},

2、rooterlink

<router-link to="/FileDetail"  tag='a'>详情 </router-link>

注以上方法都需要先配置页面的路由

  {
path: '/FileDetail',
name:'FileDetail',
component: FileDetail
}

vue实现页面跳转(简易版)的更多相关文章

  1. vue前端页面跳转参数传递及存储

    不同页面间进行参数传递,实现方式有很多种,最简单最直接的方式就是在页面跳转时通过路由传递参数,如下所示. 路由传递参数 this.$router.push({ name: '跳入页面', params ...

  2. vue 实现页面跳转

    首先,vue项目文件夹如下: components下有两个.vue文件,HelloWorld为创建时自动建立的,login需要自己创建的,login页面效果如下: 首先实现登录按钮的跳转,先对inde ...

  3. Vue项目页面跳转时候的,浏览器窗口上方的进度条显示

    1.安装: cnpm install --save nprogress 2.在main.js中引入: import NProgress from 'nprogress' import 'nprogre ...

  4. vue中页面跳转拦截器的实现方法

    首先对index.js的router进行配置; export default new Router({ routes: [ { path: '/consultancy', name: 'consult ...

  5. 【完美解决】vue,页面跳转样式错位但是刷新又好了的情况

    在vue文件中,做样式分离: 将覆盖样式单独写在一个style标签内,原页面写在 scoped样式作用域下.

  6. VUE,页面跳转传多个参数

    <template> <a @click="goNext">Next</a> <input type="text" v ...

  7. h5页面调用摄像头(简易版)

    <input type="button" value="OpenVideo" id="btnOpenVideo" /> < ...

  8. vue具体页面跳转传参方式

    1.写数据,可以使用“.”,”[]”,以及setItems(key,value);3种方式. 例如: localStorage.name = proe;//设置name为" proe &qu ...

  9. Vue -- 项目报错整理(2):IE报错 - ‘SyntaxError:strict 模式下不允许一个属性有多个定义‘ ,基于vue element-ui页面跳转坑的解决

随机推荐

  1. 5 其他命令-学习目标以及find命令的基本使用

    .caret, .dropup > .btn > .caret { border-top-color: #000 !important; } .label { border: 1px so ...

  2. sql语句复习(基础-提升-技巧-经典数据开发案例-sql server配置)

    1 基础 1.说明:创建数据库 CREATE DATABASE database-name charset=utf8 2.说明:删除数据库 drop database dbname 3.说明:备份sq ...

  3. 关于在maven项目中配置文件资源导出问题

    标准的Maven项目都会有一个resources目录来存放我们所有的资源配置文件,但是我们往往在项目中不仅仅会把所有的资源配置文件都放在resources中,同时我们也有可能放在项目中的其他位置,那么 ...

  4. 基于V7的emWin多屏显示方案模板,同时驱动LCD和OLED例程

    说明: 1.多屏驱动跟多图层驱动是类似的,可以使用函数GUI_SelectLayer做切换选择. 2.为了避免OLED闪烁问题,创建一个128*64bit的显存空间,然后使用emWin的GUI_TIM ...

  5. 如何开启php错误日志

    nginx与apache不一样,在apache中可以直接指定php的错误日志,那样在php执行中的错误信息就直接输入到php的错误日志中,可以方便查询. 在nginx中事情就变成了这样:nginx只对 ...

  6. 如何关闭jdk自动更新提示

    缘由 国庆将电脑重装了一下,jdk自然也就重装了,一开机总是提示我更新,索性就将他关掉. 解决办法 右键这个图标,点击属性. 将自动更新取消勾选.

  7. git合并多次commit提交

    在开发项目工程中经常会遇到为了一个需求产生多次提交记录.有些是可以接受的,比如按照功能点不同进行的提交.但往往会存在这种,只为了一个小东西进行改动,比如多余文件的提交.书写不规范而不得不提交的情况.多 ...

  8. js的委托事件----Vue

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. 推荐四个phpstorm酷炫实用插件 让你写代码的时候不在孤单!

    程序员写代码很孤独,每天只能和电脑屏幕交流,想要一个程序员鼓励师妹子,老板又不给配,如何让自己写代码的时候不再孤单呢?今天给大家分享的这四个插件,既实用又好玩,还能提高开发效率,这四个插件主要用到ph ...

  10. Android Service 启动流程

    执行顺序 : startService -> bindService -> unbindService -> stopService 回调的结果为: 执行顺序 : startServ ...