Vue3+ElementPlus+Koa2 全栈开发后台系统
16lz
2021-05-02
Download: Vue3+ElementPlus+Koa2 全栈开发后台系统
Vue3 ElementPlus Koa2-介绍
Element Plus，一套为开发者、设计师和产品经理准备的基于 Vue 3.0 的桌面端组件库。
到目前为止，Element每月已经获得了48800个Github Stars和100万NPM下载量。超过530位来自社区的贡献者已经作出4400个承诺，参与我们的团队的维护。Element Plus for Vue 3.0，Vue于2020年9月发布了3.0版本。为了支持最新的Vue 3.0语法，Element UI有机会发布一个包含大量内部更改和改进的新主要版本。经过23个alpha版本的开发，我们很高兴地宣布，Element Plus的Vue 3.0测试版今天发布了!Koa2一个简约、扩展性强，基于Node.js平台的web开发框架。
Vue3+ElementPlus+Koa2全栈开发后台系统具体实现
环境准备
查看node --version或npm --versioncnpm(选装)npm install -g cnpmcnpm查看cnpm --version安装npm install -g yarn查看yarn --version安装npm install -g @vue/clicnpm install -g @vue/cliyarn global add @vue/cli以上命令任选查看vue --version升级npm update -g @vue/cli或yarn global upgrade --latest @vue/cli搭建vue3.0项目
vue create [projectName]...集成element-plus
集成Koa2
常用中间件:
一、koa-bodyparser二、koa-router三、koa-views + ejs四、koa-static五、koa-session六、koa-jwt七、koa-helmet八、koa-compress九、koa-logger十、koa-convert十一、koa-compose十二、koa-http-request十三、koa-conditional-get十四、koa-csrf十五、koa-ejs十六、koa-etag十七、koa-favicon十八、koa-generic-session十九、koa-onerror二十、koa-redis二十一、koa-resource-router二十二、koa-rewrite二十三、koa-rt二十四、koa-safe-jsonp二十五、koa-static-cachekoa-router使用
const Koa = require('koa');const Router = require('koa-router');const app = new Koa();const router = new Router();//实现 '/'、'/koa'两个路由层级router .get('/',(ctx,next)=>{ ctx.body="Index page"; }) .get('/koa',(ctx,next)=>{ ctx.body="Koa page"; });app .use(router.routes()) .use(router.allowedMethods());app.listen(3000,()=>{ console.log('starting at port 3000');});Koa2中 Cookie 的使用
// 设置Cookie的值ctx.cookies.set(name, value, [options])// 获取Cookie的值ctx.cookies.get('name')Koa2 中设置全局变量可以通过 ctx.state.变量名 如下：
router.use(async (ctx, next) => { //全局的G变量 ctx.state.G = { username: ctx.session.username }})koa2 中实现 301 重定向和 302 重定向，只需要通过设置 ctx.status; 然后通过 ctx.redirect('/cart');进行跳转
// koa2 301重定向代码：ctx.status = 301ctx.redirect('/cart')// 302重定向代码：ctx.status = 302ctx.redirect('/cart')...
<br>
<br>
©著作权归作者所有：来自51CTO博客作者mb608d5d563c91f的原创作品，如需转载，请注明出处，否则将追究法律责任更多相关文章
- SOA面向服务架构——SOA的概念
- 学 Win32 汇编[19]: 查看二进制等相关函数
- 合约跟单系统开发方案【现成源码】
- 【完整版53章，附源码+电子书】Go+Python双语言混合开发-盯紧技术
- 智慧公安情报研判系统开发，重点人员可视化分析平台搭建
- 一些Java开发人员在编程中常见的雷！
- 什么是软件测试开发？为什么软件测试行业一夜之间爆火
- 狮虎论：软件测试和软件开发到底哪个实际工资更高
- ContOS下Firewalld的相关命令