复习node.js 需要注意知识点--(重点)
2.1:参数传递获取造型
客户端脚手架(发) (参数传递) node.js(收)
-发ajax this.axios.get("http://127.0.0.1:3000/list?id=9&age=19")
-收 node.js req(request 请求对象)
var id = parseInt(req.query.id);
var age = parseInt(req.query.age);
错误:node.js NaN 参数错误
2.2:完成一个功能使用哪条SQL node.js
(1)登录:
-参数:用户名密码 uname upwd
-sql:SELECT uname,upwd FROM xz_login
WHERE uname = ? AND upwd = md5(?)
用户名或密码错 result.length == 0
(2)商品列表(分页):
-参数:pno 页码 pageSize 页大小
-sql SELECT id,img_url,price,title FROM xz_product
LIMIT ?,?
? (pno-1)*pageSize
? pageSize
-sql SELECT count(id) FROM xz_product;
Math.ceil(20/pageSize); 向上取整
(3)购物车:
(0)列表 SELECT id,name,price,title,count FROM xz_cart;
(1)添加
参数:pid 商品编号 price 商品价格 count 数量
-查询当前商品是否在购物车中
SELECT id FROM xz_cart WHERE pid = ?
-如果商品己经存在 更新数量
UPDATE xz_cart SET count = ? WHERE id = ?
-如果商品不存在 添加
INSERT INTO xz_cart VALUES(null,pid,price,count,now())
(2)计算合计 脚手架计算属性
(3)修改(购物车中商品数量)
参数:id购物车项目id count 数量
sql:UPDATE xz_cart SET count = ? WHERE id = ?
(4)删除[多选]
参数:uid 谁的购物车 id=1,2,3
字符串拼接 1,2,3
sql:DELETE FROM xz_cart WHERE id IN (1,2,3)
(5)创建订单:
-参数:uid 购物车用户id
-查询购物车中数据 SELECT id,uid,price FROM xz_cart;
-添加订单表 INSERT INTO xz_order VALUES(?,?....)
2.3:node.js 非阻塞[高效 无序] 如果有功能需要严格顺序
sql1
pool.query(sql1,(err,result)=>{
//sql1 一定执行结束 结果
sql2
pool.query(sql2,)
});
3:学子商城--新闻列表
查看昨天项目 xampp node.js vue-cli
3.1:修改脚手启动时显示Home 组件
默认脚手路径 http://127.0.0.1:8080/#/
{path:'/',component:HelloContainer},
修改:当脚手架访问 / 让浏览器自动将地址 /修改/Home
功能: 跳转
{path:'/',redirect:'/Home'}
{path:'/Home',component:Home},
3.2:修改App.vue 组件
4:学子商城--新闻列表
4.1:创建按钮 "加载更多..." mint-ui
-import {Button...} from "mint-ui"
-Vue.component(Button.name,Button);
-<mt-button type="primary" size="large">加载更多...</mt-button>
4.2:创建过滤器 格式化日期对象 创建全局过滤器
-创建过滤器main.js
Vue.filter(过滤器名称,function(val){
-依据参数创建日期对象
-年 月 日 小时 分 钟 秒
-返回字符串 Y-M-D h:mi:s
});
-调用过滤器组件模板
{{item.ctime | 过滤器名称}}
4.3: 点击按钮 "加载更多..." 查看下一页
-为加载更多按钮绑定点击事件
-创建函数加载更多 {下一页}
-遇到问题:显示下一页内容上页内容覆盖
希望保存上一页内容
this.list = [];
this.list = result.data.data;
var rows = this.list.concat(result.data.data);
this.list = rows;
5:学子商城--商品列表
5.1:分析查询表
-查询当前页内容
xz_laptop 商品表
xz_laptop_pic 商品图片表
商品编号 商品标题 商品价格 商品图片
lid title price md
(1)查询表保存在 FROM后
(2)为每张表创建别名
(3)查找两张表哪列有关联的 = <= >=
SELECT l.lid,l.title,l.price,p.md
FROM xz_laptop l,xz_laptop_pic p
WHERE l.lid = p. laptop_id
GROUP BY l.lid
LIMIT ?,?;
app.js
5.2:脚手架
-创建空组件 src/components/goods/GoodList.vue
-配置访问路径 /GoodsList
-测试
-设置布局
调错/添加按钮/添加点击事件
常见错误
(1) net::ERR_CONNECTION_RESET node.js程序出错停止工作
解决:查看node.js 控制台出错信息
(2)error in your SQL syntax
原因:sql语法写错了