地址:http://jspang.com/

https://github.com/shenghy/SmileVue

1、vant  https://www.youzanyun.com/zanui/vant#/zh-CN/intro

2、使用vant按需引入想要的组件,import { Button } from 'vant';

前提是要引入 babel-plugin-import

https://www.youzanyun.com/zanui/vant#/zh-CN/quickstart

在.babelrc中配置plugins(插件)

 "plugins": [
"transform-vue-jsx",
"transform-runtime",
["import",{"libraryName":"vant","style":true}]
]

3、使用谷歌浏览器,模拟slow 3G状况(就是网速慢的时候),可以使用这个

4、自己mokr数据

https://www.easy-mock.com

5、懒加载

利用Vant实现图片轮播的懒加载

引入Vant的图片懒加载组件,以后我们的项目中会有很多远程图片,所以启用图片懒加载是必须的,那正好我们这里第一次开始用远程图片,就在这里学一下图片的懒加载

 import { Button, Row, Col ,Search , Swipe , SwipeItem , Lazyload  } from 'vant'
Vue.use(Button).use(Row).use(Col).use(Search).use(Swipe).use(SwipeItem).use(Lazyload)

然后修改一下我们的template区域,加入v-lazy="banner.imageUrl"就可以图片的懒加了。

6、Mongoose中的三个概念

  • schema :用来定义表的模版,实现和MongoDB数据库的映射。用来实现每个字段的类型,长度,映射的字段,不具备表的操作能力。
  • model :具备某张表操作能力的一个集合,是mongoose的核心能力。我们说的模型就是这个Mondel。
  • entity :类似记录,由Model创建的实体,也具有影响数据库的操作能力。

7、23课插入数据失败

原因是:User.js里面的和index.js里model里的user不一致

解释下:User.js的mongoose.model('user', userSchema)是以userSchema为模板创建user模型。(只要创建一次就行)

index.js里的mongoose.model('user')是为了创建下面的实例

8、在Node,用下面的方法可以把一个文件夹中的同类型文件都引入(这也算是Node的一个小技巧)

http://jspang.com/2018/04/15/vuekoa/#23-schema   看这个

需要用到glob和resolve

9、密码加盐加密  使用了bcrypt

http://jspang.com/2018/04/15/vuekoa/#24

10、在koa中,使用post请求数据的时候,要用koa-bodyparse这个插件

http://jspang.com/2017/11/13/koa2/#06koa-bodyparser

使用koa2-cors插件,来处理跨域请求

11、路由模块化(就是把同类的路由放到一起)

http://jspang.com/2018/04/15/vuekoa/#26-koa2  具体看这里

如果对要求比较高的小伙伴,可以看一下egg.js的路由写法或者直接使用egg.js来进行开发

Vue.js+Koa2移动电商实战 笔记的更多相关文章

  1. Vue.js+Koa2移动电商 笔记

    一.搭建项目架构: 项目采用Webpack+Vue-router的架构方式,开始安装(基于windows系统) 1.按Win+R,然后在文本框中输入cmd,回车打开命令行,输入vue-cli安装命令: ...

  2. 微信小程序电商实战-首页(上)

    嗨,大家好!经过近两周的精心准备终于开始微信小程序电商实战之路喽.那么最终会做成什么样呢?当然可以肯定不会只做一个静态demo哦,先把我们小程序电商实战的整体架构发出来晒一下,请看下图:   架构图. ...

  3. 01-Flutter移动电商实战-项目学习记录

    一直想系统性的学习一下 Flutter,正好看到该课程<Flutter移动电商实战>的百度云资源,共 69 课时,由于怕自己坚持不下去(经常学着学着就不学了),故采用博客监督以记之. 1. ...

  4. vue.js+koa2项目实战(一)创建项目和elementUI配置

    前端采用vuex+element-ui: 后端采用koa2+restfulAPI+sequlize: (一)项目介绍 宠物社区 1.社区 2.好友 3.说说 4.宠粮 5.健康 (二)项目框架 1.V ...

  5. vue.js+koa2项目实战(三)登录注册模态框

    登录注册模态框 注: [Vue warn]: Do not use built-in or reserved HTML elements as component id: diaLog 原因:diaL ...

  6. GitHub Vue项目推荐|Vue+Element实现的电商后台管理系统功能丰富

    GitHub Vue项目推荐|mall-admin-web是一个电商后台管理系统的前端项目基于Vue+Element实现 主要包括商品管理.订单管理.会员管理.促销管理.运营管理.内容管理.统计报表. ...

  7. Java架构师系统培训高并发分布式电商实战activemq,netty,nginx,redis dubbo shiro jvm虚拟机视频教程下载

    15套java架构师.集群.高可用.高可扩 展.高性能.高并发.性能优化.Spring boot.Redis.ActiveMQ.Nginx.Mycat.Netty.Jvm大型分布 式项目实战视频教程 ...

  8. laravel 5.5 《电商实战 》基础布局

    我们需要为我们的项目构建一个基础的页面布局,布局文件统一存放在 resources/views/layouts 文件夹中,布局涉及的文件如下: app.blade.php —— 主要布局文件,项目的所 ...

  9. L05 Laravel 教程 - 电商实战

    https://laravel-china.org/courses/laravel-shop https://laravel-china.org/topics/13206/laravel-shop-c ...

随机推荐

  1. MySQL命令 导出 数据和结构

    网上的真是仅供参考,啥也不想说. //先找到mysqldump的目录 //Centos7中位于 /usr/bin 中 然后执行命令: cd /user/bin mysqldump -u [用户名] - ...

  2. .NET中26个优化性能方法

    1. 数据库访问性能优化 数据库的连接和关闭 访问数据库资源需要创建连接.打开连接和关闭连接几个操作.这些过程需要多次与数据库交换信息以通过身份验证,比较耗费服务器资源.ASP.NET中提供了连接池( ...

  3. 记一次B站答题经历

    第一题部分:社区规范卷 --------- ------------ 第二题:社区规范第二部分 -------------------- 第三部分自由选择题 --------------------- ...

  4. 2、JDBC-CURD

    添加,修改,删除 package test.jdbc; import org.junit.jupiter.api.AfterEach; import org.junit.jupiter.api.Bef ...

  5. bzoj千题计划304:bzoj3676: [Apio2014]回文串(回文自动机)

    https://www.lydsy.com/JudgeOnline/problem.php?id=3676 回文自动机模板题 4年前的APIO如今竟沦为模板,,,╮(╯▽╰)╭,唉 #include& ...

  6. PHP7 学习笔记(五)安装event扩展(libevent)

    一.描述:有效安排I/O,时间和信号的扩展 使用可用于特定平台的最佳I/O通知机制的事件,是PHP基础设施的libevent端口. 二.下载地址:http://pecl.php.net/package ...

  7. C++中模板的使用

    为什么使用模板: C++重载(overloading),重载函数一般含有不同的参数个数或不同的参数类型.如果使用MAX函数对不同类型的求最大值,就要定义不同的重载函数: int max(int x,i ...

  8. Python巧用正则表达式,完成接口参数替换

    最近给Python11期的小朋友们上课,遇到了一个参数替换的问题,首先描述下场景: 需要参数化的数据如下所示: 这个时候如果利用单纯的if判断和字符串的find和replace方法,做起来是非常不明智 ...

  9. strstr函数字符串匹配问题

    题目链接:http://acm.sdut.edu.cn/onlinejudge2/index.php/Home/Index/problemdetail/pid/2772.html AC代码: #inc ...

  10. mongodb系列~mongodb数据迁移

    一 简介:今天来聊聊mongo的数据迁移二 迁移   1 具体迁移命令   nohup mongodump --port --db dbname --collection tablename --qu ...