前端vue项目搭建（router路由，element项目配置）

最新推荐文章于 2024-07-18 17:32:29 发布
最新推荐文章于 2024-07-18 17:32:29 发布
阅读量399 收藏
点赞数 6
文章标签： 前端 vue.js javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/2301_77116754/article/details/137646258
版权

一、创建一个vue2的项目

二、创建成功后删除这三个文件

三、新建一个App.vue文件

四、在文件中添加这一段话

五、打开命令框输入指令下载router路由

六、新建一个router目录，新建index.js文件

七、导入你的路由，进行配置

八、在main.js中配置路由

九、安装element

十、main.js中配置element插件

这样vue的配置就完成了，在vue中，即可按照html+css+js的格式写即可

刘伊珂
关注
  • 6
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
vue3新建项目，配置路由vue-router，引入element-plus
01-08
总的来说，这个项目是一个使用Vue3、Vue Router 4和Element Plus的简单应用，涵盖了前端开发中的基本架构和组件库的使用。通过这个项目，你可以学习到如何配置Vue3项目、设置路由以及引入和使用UI组件库。
vue新建项目并配置标准路由过程解析
10-15
总结来说，Vue中的路由配置包括创建Router实例，定义路由规则，导入并使用`router`实例，以及在`App.vue`中使用`<router-view>`来展示路由对应的组件。这个过程对于理解Vue应用的结构和导航逻辑至关重要，是每个Vue...
【Vue篇】详解router路由 | element-ui组件 | 嵌套路由
小吉妙妙屋
12-27 1968
Vue Router是Vue.js官方提供的用于构建单页应用（SPA）的路由管理器。它能够集中处理应用程序中的路由跳转、参数传递、页面切换等功能，使得开发者可以轻松地实现前端路由功能。Vue Router具有以下特点：声明式路由配置：Vue Router使用声明式的方式配置路由，通过简单的配置项，可以定义页面路径、对应的组件以及其他相关信息。这种配置方式直观且易于维护。嵌套路由：Vue Router支持嵌套路由，即一个路由下面可以包含多个子路由，从而实现更复杂的页面结构和组织方式。
element动态路由的配置
qq_34652478的博客
11-08 906
基于vue+element，把静态路由改为动态路由 修改动态路由的过程 第一步：修改理由配置文件，只留下login, router/index.js import Vue from 'vue' import Router from 'vue-router' Vue.use(Router); const commonRoutes = [ { path: '/login', type...
2.前端路由的配置和使用
老九的博客
05-11 288
这个有个小插曲，一直提示我这个路径的页面文件不存在，网上搜了下好像是Vetur跟Vue3不兼容的关系，但是我这里安装Vetur，所以我把Vue - Official重新安装了下，然后重启了下Visual Studio Code就解决了。然后我们先在我们的文件目录中创建router文件夹，然后新建路由文件index.ts。路径：src\views\index\LoginPage.vue。首先创建一个我们需要访问的页面文件，这里我先创建了一个登录界面。然后在你的main.ts文件下添加引用route的引用。
elementui通过router配置多级导航菜单
热门推荐
潇蓝诺依的博客
05-19 3万+
<template> <el-menu :default-active="$route.path" background-color="#545c64" text-color="#fff" active-text-color="#ffd04b" mode="vertical" router > <side...
vue3创建项目（二）router路由配置和使用
zhangxueyou2223的博客
09-26 1279
vue3创建项目（二）router路由配置和使用
vue项目前端埋点的实现
10-17
在Vue项目中实现前端埋点是一项关键任务，用于收集用户行为数据，以便分析用户交互、优化用户体验和制定营销策略。本文将深入探讨两种常见的前端埋点技术：命令式埋点和声明式埋点，并结合Vue的自定义指令和路由拦截...
vue+vuex+vueRouter+axios+element.zip
08-12
在“vue+vuex+vueRouter+axios+element.zip”这个项目中，开发者结合了Vue的核心特性与其他重要的库和工具，构建了一个功能完备的前端应用。 Vue Router 是Vue.js的官方路由管理器，它允许我们通过URL来控制应用的...
前端VUE实战——去哪儿网项目实战.7z
08-17
在本项目中，我们将深入探讨基于Vue.js框架的前端实战应用——去哪儿网项目。Vue.js是一个轻量级、高性能的JavaScript框架，专为构建用户界面而设计，特别适合开发单页面应用（SPA）。通过这个实战项目，我们可以...
vue3前端开发-小兔鲜项目-人气推荐栏目的前端渲染
yrldjsbk的博客
07-18 338
除了必要的import导入之外，剩余的就是直接调用了，赋值了。经历过上一次的，新鲜好物的栏目渲染之后，我们已经熟练了，vue3的接口调用，数据渲染到页面中的整体流程。如图，我们已经做好了，列表的渲染赋值。里面可以看见，顶部是脚本，中间是模板，底部是样式。在首页面，内容里面，会看见很多内容，上期内容我们已经完成了新鲜好物的渲染操作。1：打开接口文档，查询：人气推荐栏目的接口地址信息和参数，返回值对象信息等。以上内容就是，已经写好的，HomeHot的模板代码了。如图，地址信息和调用的方式已经清楚了。
Web前端-Web开发CSS基础6-弹性盒子
a15735748145a的博客
07-16 1252
10. stretch，这意味着弹性盒子在布局的时候，不论是一行一行地布局，还是一列一列地布局，垂直方向上的各元素都将会自动扩展，以填满父元素的高度。11. stretch，这意味着弹性盒子在布局的时候，不论是一行一行地布局，还是一列一列地布局，垂直方向上的各元素都将会自动扩展，以填满父元素的高度。12. stretch，这意味着弹性盒子在布局的时候，不论是一行一行地布局，还是一列一列地布局，垂直方向上的各元素都将会自动扩展，以填满父元素的高度。
浏览器的卡顿与react的解决思路
最新发布
weixin_45575944的博客
07-18 310
众所都周知，js是单线程，当react处理vdom相关工作的时候，会阻塞浏览器的渲染过程，阻塞了渲染过程，那么页面就卡着。结合上面所述，1秒60hz，相当于16.67ms至少需要渲染出1张新图，才不会觉的卡顿。我理解这里的卡顿，并不是说优化的怎么怎么好让总工作量少了，处理的快了，而是可能虽然每次渲染出来的新内容少，但是他仍然在生成，而不会在处理过程中一直不变，然后突然渲染出来，这种抖动的、掉帧的渲染方式，容易让人觉的他卡了，而一直在变化，虽然每次变化的不多，但总体是‘流畅的’
【Vue】 style中的scoped
DX390609的博客
07-15 164
在vue文件中的style标签上，有一个特殊的属性：scoped。当一个style标签拥有scoped属性时，它的CSS样式就只能作用于当前的组件，通过该属性，可以使得组件之间的样式不互相污染。
中间件的理解
modi000的博客
07-15 409
直接返回，前置服务可以支持更高流量的并发，后置的需要耗时、耗力的，需要IO操作的服务，可以通过MQ慢慢处理。前端写消息的速率比后端处理消息的速率要快很多的。a.快递员角度：快递员无需将快递直接交到用户手里，放在菜鸟驿站即可走了，增加了送快递的数量，提高了送快递的效率；b.用户角度：快递到达的时候在上班，当时无时间取快递，当有了菜鸟驿站后，用户可以在下班闲暇时间去取快递。所以，中间件可以多个可能互相调用的系统耦合程度，提升接口的响应速度，。c.双十一的时候，快递量暴增，快递员不会手忙脚乱、用户可排序取快递。
【前端】JavaScript入门及实战6-10
weixin_45980065的博客
07-17 567
如果使用Number表示的数字超过了最大值，则会返回一个Infinity，表示正无穷，typeof是number。NaN是一个特殊的数字，不是数字：not a number，是一个字面量，typeof是number。但是注意，null和undefined这两个值没有toString()方法，如果调用会报错。它会将null直接转换为"null"，将undefined直接转换为"undefined"当声明一个变量，但是并不给变量赋值时，它的值就算undefined。该方法不会影响原变量，它会将转换的结果返回。
cookies,sessionStorage和localStorage都有什么区别
qq_51856496的博客
07-17 299
cookies,sessionStorage和localStorage都有什么区别 cookies在请求数据传输的时候会携带至后台，sessionStorage,localStorage是纯客户端缓存 cookies有过期机制,sessionStorage是会话级缓存，窗口关闭后会销毁，localStorage是本地持久缓存手动才会清除 cookies只能存储4KB并且不推荐前端用js直接操作，sessionStorage,localStorage存储有5MB
(三)js前端开发中设计模式之工厂模式
峰会路转的博客
07-17 228
工厂模式是一种创建型设计模式，它可以帮助我们根据需求创建对象。
前端vue毕设项目【易购商城】vue + vuex + vue-router + element ui + axios + vu
08-25
在该项目中，我使用了Vue、Vuex、Vue Router、Element UI、Axios等技术和库来实现各种功能。 首先，Vue是一种流行的前端框架，它具有响应式的数据绑定和组件化的特性，使得开发者可以轻松构建交互性强、高效的单...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

刘伊珂

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值