【vue】vue项目启动设置默认启动页

这篇具有很好参考价值的文章主要介绍了【vue】vue项目启动设置默认启动页。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

当我们在启动vue项目时,默认打开的界面是白色的,需要输入正确的路由才能访问正确的页面。我们应该如何让项目打开的时候默认跳转到想启动的页面呢?
我们需要在router的index.ts(js)文件中设置路由规则,例如我们默认打开index页面,我们只需要设置routes,内容如下:

routes:[
        {
            path:'/index',
            component:Index 
        },
        {
            path:'/',
            redirect:'/index'  //默认显示
        }
    ]

这样就可以做到打开项目时,自动重定向到index页面。文章来源地址https://www.toymoban.com/news/detail-509820.html

到了这里,关于【vue】vue项目启动设置默认启动页的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • Win10和Win11上设置VS(Visual Studio)默认以管理员权限权限启动设置方法

    如果只需要当前启动为管理员权限,方法如下: 1、使用“开始”菜单 2、根据所使用的 Windows操作系统 版本,执行以下步骤之一: 在 Windows 10 中,打开“开始”菜单,然后滚动到 Visual Studio。 在“Windows 11”中,选择“开始”按钮,然后在“搜索”框中键入“Visual Studio”。

    2024年02月11日
    浏览(79)
  • git修改默认主分支main为master和设置git默认创建的项目默认分支都为master

    从 2020 年 10 月 1 日开始, GitHub 上的所有新库都将用中性词「main」命名,取代原来的「master」 ,因为后者是一个容易让人联想到奴隶制的术语。 这样,你之后新建仓库的默认分支就为master了。 单击该仓库最右边settings—branches—点击双箭头—在弹框中选择master—update—I un

    2024年02月10日
    浏览(43)
  • idea新建Springboot项目,设置默认maven和jdk版本

    问题: 由于每次新建Springboot项目,maven总是在c盘和jdk版本不是自己需要的版本。每次都需要自己重新配置。 解决: 为了解决这个问题,设置新建项目时指定默认配置。 一、设置新建项目时,默认指定的Maven版本 1.file–》Other Settings–》settinf for… 2.找到Maven配置。配置上即

    2024年02月16日
    浏览(67)
  • IDEA之设置项目包的结构层级为eclipse默认样式

    idea默认项目包的结构层级如下: 想修改成eclipse默认的那种样式,设置步骤如下: 1.点击下图中红框图标进行设置 2.选择 Tree Appearance,取消勾选 Compact Middle Packages 3.勾选红框里的两个选项,Flatten Packages 和 Hide Empty Middle Packages(隐藏空包) 结果如下所示为eclipse默认的包结构样式

    2024年02月04日
    浏览(40)
  • vue前端开发自学练习,Props数据传递-类型校验,默认值的设置!

     vue前端开发自学练习,Props数据传递-类型校验,默认值的设置! 实际上,vue开发框架的时候,充分考虑到了前端开发人员可能会遇到的各种各样的情况,比如大家经常遇到的,数据类型的校验,再比如,默认值的设定等等。下面给大家展示一下,源码。和实际的效果。 如图,

    2024年01月23日
    浏览(39)
  • Vue.js安装与创建默认项目(详细步骤)

    前言 上一篇博文已经对Node.js的安装与配置进行了详细介绍,详见https://blog.csdn.net/qq_42006801/article/details/124830995 另外:文中项目存放的路径及项目名称可根据自身实际情况进行更改。         Vue是一套用于构建用户界面的渐进式JavaScript框架。与其它大型框架不同的是,V

    2024年02月02日
    浏览(46)
  • vue3项目使用样式穿透修改elementUI默认样式

    在css单文件中,我们在style标签中写组件的样式,可以看到,一般style标签都会带上一个scoped属性,这样可以实现及时不同组件选择器一样,但是样式互不干扰。 看一个例子,我们在两个组件中都定义一个 hello-world-box 类,在对应的scope标签中设置不同的样式。 可以看到,vu

    2023年04月09日
    浏览(41)
  • 【IntelliJ IDEA】idea修改设置默认maven,解决每次新建和导入项目都需要重新配置maven

    本文目录 一、开发工具 二、问题描述 三、解决方案 开发工具:IntelliJ IDEA 工具版本:Ultimate 2020.3 使用 idea 开发工具每次打开一个已有项目时,都需要重新配置一下 maven(Maven home path 和 User settings file)。这个问题出现好久了,问题不严重,但是特别烦人。 设置 Maven 路径和

    2024年02月14日
    浏览(73)
  • 【异常解决】vue项目localhost:8080无法访问此网站或者无法访问此页面,localhost拒绝了我们的连接请求

    前端页面使用的是vue,vue项目启动成功,没有任何报错,服务控制台已出现APP访问地址,如下图所示: 点击访问地址,浏览器打开后页面先是空白,然后过了一会儿显示无法访问此网站,localhost拒绝了我们的连接请求页面,信息如下: 出现此问题的原因有以下几种:请挨个

    2023年04月25日
    浏览(73)
  • Vue下载安装步骤的详细教程(亲测有效) 2 安装与创建默认项目

    上篇请移步到Vue下载安装步骤的详细教程(亲测有效) 1_水w的博客-CSDN博客 上一篇博文已经对Node.js的安装与配置进行了详细介绍。 另外:文中项目存放的路径及项目名称可根据自身实际情况进行更改。 目录 三、Vue安装配置 1、搭建Vue脚手架 2、通过NPM安装Vue (1)安装Vue脚手架

    2024年02月02日
    浏览(51)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包