Django5+Vue3:OA系统前后端分离项目实战-前端项目初始化(8)

Django5+Vue3系列文章

前言

本节开始,全文仅对会员开放。

若点赞和收藏数量超过100,全文将免费开放。

 此项目采用 Django 框架的 5.0.7 版本进行开发。

Django 5.0 支持的 Python 版本为 3.10、3.11 和 3.12。

OA 系统系列文章将持续更新,直至项目的 Docker 部署阶段。

专栏链接:  ~快捷传送门: 留个赞再走呗😭! ~

个人博客: ~所有文章尽在简客免费阅读~

文章目录

目录

Django5+Vue3系列文章

前言

文章目录

一、创建前端项目

1.打开项目文件夹,初始化vue3前端项目

二、frame和login结构搭建

1.移除所有非必要的默认文件

1.重写App.vue

2.移除views文件夹中的默认文件AboutView.vue和HomeView.vue

3.移除main.js文件第一行,取消导入main.css

2.frame框架与login登录功能模块化

1.在src/views目录下分别建立login和main子目录,用于存放login.vue和frame.vue视图组件

2.在src/views目录下新建login.vue以及frame.vue

3.setup上快捷指定组件名称

三、router路由添加

1.打开src\router\index.js文件,添加路由

2.测试路由是否添加成功

总结

一、创建前端项目

请在创建项目时使用Vue 3.10.3版本,以确保兼容性并避免潜在错误。

1.打开项目文件夹,初始化vue3前端项目

代码如下(示例):

创建完成(示例如下): 

项目结构(示例):

D:yourproject
├─oaback
│  
└─oafront


二、frame和login结构搭建

1.移除所有非必要的默认文件

1.重写App.vue
<script setup>

</script>

<template>
  <RouterView />
</template>

<style scoped>

</style>
2.移除views文件夹中的默认文件AboutView.vue和HomeView.vue
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

打赏作者

Fenderisfine

蟹蟹你的奶茶😘

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

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

打赏作者

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

抵扣说明:

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

余额充值