iis服务器助手广告广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >vue在.js文件中如何进行路由跳转
  • 480
分享到

vue在.js文件中如何进行路由跳转

js路由跳转vue路由跳转js文件路由跳转 2022-12-08 20:12:49 480人浏览 泡泡鱼
摘要

目录Vue在.js文件中进行路由跳转在ts/js文件中跳转路由写法(不是在vue文件中跳转路由)vue在.js文件中进行路由跳转 我们在.vue文件中js跳转路由是this.$rou

vue在.js文件中进行路由跳转

我们在.vue文件中js跳转路由是this.$router.push("/")

在.js文件中,只需要先引入router 然后 router.push("/") 进行跳转

import router from'…/router'
router.push('/');

在ts/js文件中跳转路由写法(不是在vue文件中跳转路由)

<template>
  <a-button @click="Goto">跳转页面</a-button>
</template>
<script setup name="detail" lang="ts">

  import { useDetail } from './useDetail';

  const { goto } = useDetail();
</script>
<style lang="less" scoped></style>
import { useRouter } from 'vue-router';

export const useDetail = () => {
  // const router = useRouter(); //方法一
  const { replace } = useRouter();//方法二
  const goto = () => {
    // router.replace({ name: 'finance-proj-reimburse-list' }); //方法一
    replace({ path: '/finance/proj-reimburse-list/' });//方法二
  };
  return { goto };
};

以上为个人经验,希望能给大家一个参考,也希望大家多多支持编程网。

--结束END--

本文标题: vue在.js文件中如何进行路由跳转

本文链接: https://www.lsjlt.com/news/174430.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • vue在.js文件中如何进行路由跳转
    目录vue在.js文件中进行路由跳转在ts/js文件中跳转路由写法(不是在vue文件中跳转路由)vue在.js文件中进行路由跳转 我们在.vue文件中js跳转路由是this.$rou...
    99+
    2022-12-08
    js路由跳转 vue路由跳转 js文件路由跳转
  • vue如何进行路由跳转
    这篇文章主要介绍“vue如何进行路由跳转”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“vue如何进行路由跳转”文章能帮助大家解决问题。一、使用vue-routervue-router 本质是一个第三...
    99+
    2023-07-04
  • vue如何路由跳转
    在vue中实现路由跳转的方法有:1.使用this.$router.push()跳转;2.使用router-link跳转;在vue中实现路由跳转的方法有以下几种使用this.$router.push()跳转1)不带参跳转this.$route...
    99+
    2024-04-02
  • vue中如何实现路由跳转
    这篇文章主要介绍vue中如何实现路由跳转,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!跳转方式:1、用“<router-link :to="{..}">”语句;2、用“this.$ro...
    99+
    2023-06-25
  • vue两个路由之间怎么进行跳转
    今天小编给大家分享一下vue两个路由之间怎么进行跳转的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。Vue的路由是通过vue-...
    99+
    2023-07-05
  • Vue如何实现路由跳转
    这篇文章将为大家详细讲解有关Vue如何实现路由跳转,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。单页一应用的路由模式有再种1、哈希模式(利用hashchange事件监听u...
    99+
    2024-04-02
  • vue两个路由之间如何进行跳转(方法浅析)
    Vue是一款非常流行的JavaScript框架,它允许我们通过构建组件化的Web应用程序来提高开发效率。Vue.js的路由系统允许我们在不同的页面之间导航,本文将介绍如何进行Vue两个路由之间的跳转。Vue的路由是通过vue-router插...
    99+
    2023-05-14
  • vue如何实现父级路由跳转子路由
    今天小编给大家分享一下vue如何实现父级路由跳转子路由的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。子路由配置首先,我们需要...
    99+
    2023-07-05
  • vue如何对路由进行拦截
    在vue中对路由进行拦截的方法:1.新建项目,引入vue和router;2.引入aixos;3.执行代码对路由进行拦截;具体步骤如下:首先,在新建一个html项目,并在项目中引入vue和router;import Vue from 'vue...
    99+
    2024-04-02
  • vue如何使用router-link实现路由跳转
    这篇文章主要介绍vue如何使用router-link实现路由跳转,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!router-link 【实现跳转最简单的方法】<router-link to='...
    99+
    2023-06-18
  • vue跳转同一路由报错如何解决
    今天小编给大家分享一下vue跳转同一路由报错如何解决的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。vue跳转同一路由报错vu...
    99+
    2023-07-05
  • (超详细)vue怎么进行路由跳转?三种方式分享
    步骤 (7步法 ):1、下载vue-router模块到当前工程 yarn add vue-router2、在main.js中引入VueRouter函数// 引入路由 import VueRouter from "vue-route...
    99+
    2023-05-14
    路由跳转 Vue
  • 如何在Android中将Uri与文件路径进行转换
    如何在Android中将Uri与文件路径进行转换?针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。public class GetPathFromUri&n...
    99+
    2023-05-30
    android uri
  • vue如何设置路由拦截及页面跳转
    这篇文章主要为大家展示了“vue如何设置路由拦截及页面跳转”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“vue如何设置路由拦截及页面跳转”这篇文章吧。路由设置:...
    99+
    2024-04-02
  • Vue+ElementUi实现点击表格中链接进行页面跳转与路由详解
    目录1、页面跳转,先看效果2、路由切换加传参数,先看效果总结1、页面跳转,先看效果 点击表格中的asin会跳转到亚马逊购物界面 怎么做的呢,直接上代码 <el-table-...
    99+
    2023-02-13
    vue路由跳转打开新页面 element ui页面跳转 vue element 动态路由
  • vue如何实现路由跳转到外部链接界面
    目录vue路由跳转到外部链接界面vue路由跳转说明vue路由跳转到外部链接界面 项目中用前端的是vue框架,有一个需求是,当点击一个按钮后,跳转到原来已经发布过的ionic界面上。 ...
    99+
    2022-11-13
    vue路由跳转 vue跳转外部链接界面 vue 链接跳转
  • vue中的路由跳转tabBar图片和文字的高亮效果
    目录前言定义基本的组件文字高亮效果完整代码前言 在pc端和移动端的项目里面会遇见导航栏或者tabBar的点击跳转,图片和文字的高亮效果,对于小程序来说可以直接创建和修改图片和文字的高...
    99+
    2024-04-02
  • Angular4.x如何通过路由守卫进行路由重定向实现根据条件跳转到相应的页面
    这篇文章主要介绍了Angular4.x如何通过路由守卫进行路由重定向实现根据条件跳转到相应的页面,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下...
    99+
    2024-04-02
  • Vue3如何使用Vue-Router进行路由控制
    目录1.安装Vue-router3.固定路由跳转4.动态路由跳转5. vue-router配置文件6.在代码中控制路由跳转1.安装Vue-router 传送门:官方文档 yarn a...
    99+
    2024-04-02
  • vue-router是如何实现路由跳转和页面渲染的
    Vue-router是Vue.js官方的路由管理工具,支持基于Vue.js构建单页应用(SPA),它提供的路由功能让我们能够通过管理URL中的路径,来控制页面的跳转和展示。本文将着重探讨 Vue-router 的底层实现原理,分析 Vue-...
    99+
    2023-05-14
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作