做门窗网站青岛百度整站优化服务

为了后续开发方便，在没有 UI 设计师配合的情况下，让我们的界面更加美观，我们使用 elementplus 组件库，并配置路由。

删除不需要的默认文件夹及文件，src 配置如下

实现效果

安装 elementplus,vue-router

npm install element-plus --save
npm install vue-router --save

• 在 main.js 中引入 element-plus

import { createApp } from 'vue'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import App from './App.vue'const app = createApp(App)
app.use(ElementPlus).mount('#app')

• 创建 router 文件夹，并编写 index.js

//引入vue-router
import { createRouter, createWebHistory } from 'vue-router'//引入组件
//引入vue-router
import { createRouter, createWebHistory } from 'vue-router'//引入组件
import Home from '@/components/Home.vue'
import About from '@/components/About.vue'
//创建路由对象
const router = createRouter({history: createWebHistory(),routes: