基于vue3.0+vue-cli4.0+mysql+koa2的商城系统第一期_koa2开源商城

基于vue3.0+vue-cli4.0+mysql+koa2的商城系统

组件包含

具体依赖如下图所示

具体创建的方法项目不在这里介绍
项目总体目录结构如下图所示

具体创建组件的步骤在此省略，直接进行代码编辑环节
第一步：创建项目的路由
官方vue-router介绍连接：https://router.vuejs.org/zh/guide/
首先创建文件router.js用来承载项目的路由，一个路由想要被使用那就需要被注册任何插件在vue中都是如此，
通过vue.use()将vue-router注册进vue当中
（1）import Vue from ‘vue’
（2）import Router from ‘vue-router’
（3）Vue.use(Router);
通过import引入在pages页面文件夹中创建的项目，文件引入路径一定需要注意首先通过./找到路由所在文件夹再通过/pages找到页面文件夹最后再通过/文件名找到需要引入的文件（在这里.Js可以省略）
本此项目主要为6个页面，后续还可能添加一些页面来完善项目

想要节省资源那就需要代码的复用，所以大致分为两个部分页面的头部和页面的尾部的代码复用，具体路由定义如下代码所示

import Vue from 'vue'
import Router from 'vue-router'
import Home from './pages/home'
import Index from './pages/index'
import Active from './pages/active'
import Login from './pages/login'
import Register from './pages/register'
import Order from './pages/order'
import ShopIndex from './pages/ShopIndex'
import Detail from './pages/detail'</
1
2
3
4
5
6
7
8
9