七天学习
第一天
零散知识
- IOT编程语言： C C++ JAVA python js node.js
- 什么是大前端？
- 前端功能日益健全 很多时候可以脱离后端进行开发测试
egg.js
- 项目快速初始化详见文档
- 多种请求
app/controller/product.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49const Controller = require('egg').Controller;
class extends Controller{
async index(){
const {ctx} = this;
ctx.body= 'product';
}
async detail(){
const { ctx } = this;
console.log(ctx.query);
ctx.body =id==<span class="subst">${ctx.query.id}</span>;
}
async detail2(){
const { ctx } = this;
console.log(ctx.params);
ctx.body =id==<span class="subst">${ctx.params.id}</span>;
// product/detail2/100
}
async create(){
const { ctx } = this;
console.log(ctx.request.body)
const {name,weight} = ctx.request.body;
//body中发送
ctx.body={
name,
weight
};
}
async update(){
const { ctx } = this;
console.log(ctx.params)
ctx.body={
id:ctx.params.id
};
}
async delete(){
const { ctx } = this;
console.log(ctx.params)
ctx.body={
id: ctx.params.id
}
}
}
module.exports = ProductController;app/router.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15;
/**
* @param {Egg.Application} app - egg application
*/
module.exports = app => {
const { router, controller } = app;
router.get('/', controller.home.index);
router.get('/product',controller.product.index);
router.get('/product/detail',controller.product.detail);
router.get('/product/detail2/:id',controller.product.detail2);
router.post('/product/create',controller.product.create);
router.put("/product/update/:id",controller.product.update);
router.delete("/product/delete/:id",controller.product.delete);
};service
view模板渲染
- 在项目目录下安装
- EJS：高效的js模板引擎
第二天
遇到的坑(关于egg的初始化) 连接超时
解决方案：安装淘宝源
- npm config set registry https://registry.npm.taobao.org
- npm config get registry
- npm install -g cnpm –registry=https://registry.npm.taobao.org
接下来命令
- cd d:/article/server
- cnpm init egg –type=simple
- cd init
- cnpm i
- cnpm run dev
安装淘宝源后 npm=>cnpm
vue.js
-
1
npm install -g @vue/cli-service-global
安装全局拓展之后
- vue create hello-world （创建新的vue项目，当然是cd到你想要创建的目录之下）
- vue ui （图形化界面 可以不用）
- cnpm run serve （启动vue项目）
- cnpm i vant -S （安装vant组件库）
cnpm i babel-plugin-import -D
1
2
3
4
5
6
7
8
9
10
11// 在.babelrc 中添加配置
// 注意：webpack 1 无需设置 libraryDirectory
{
"plugins": [
["import", {
"libraryName": "vant",
"libraryDirectory": "es",
"style": true
}]
]
}
egg.js 连接数据库
- cnpm i –save moment
第三天
前后端联调跨域问题
命令行生成egg.js
支持的路由 get post put delete
命名规范
同步请求 async和await
router中引入controller
service ctx上下文引入
csrf学习中关闭掉
egg.js的模板引擎（存放在view下面）
vant 按需加载
egg.js连接数据库 要引入插件 配置
近期评论