692人加入学习
(12人评价)
Vue.js+Koa2 移动电商实战视频教程

从零开始搭建移动电商系统,包括购物功能,注册登录,积分系统,签到制作,后台接口设置,权限管理,后台。

价格 ¥ 188.00 ¥376.00 5折
活动
承诺服务
会员免费学 购买课程

快速生成页面格局  Vue-Base

 

[展开全文]

schema :用来定义表的模版,实现MongoDB数据库的映射

model :具备表操作能力的一个集合,是mongoose的核心能力

entity:类似记录,由Model创建的实体

[展开全文]

进入service目录下

sudo npm install --save mongoose

[展开全文]

//设置rem let htmlwidth = document.docymentElement.clientWidth ||document.body.clientWidth;

let htmlDom = document.getElementsByTagName('html')[0];

htmlDom.style.fontSize = htmlwidth/20+'px';

[展开全文]

babel-plugin-import:按需引入

安装完之后在.babelrc文件中将plugins改为 

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

 

[展开全文]

1rem =font-size 16px;

 

以iphon5作为基础适配其他设备

let htmlwidth = document.documentElement.dlientWidth ||document.body.clientWidth;

let htmlDom = document.getElementByTagName('html')[0];

htmlDom.style.fontSize = hrmlwidth/20 +'px'

 

[展开全文]

1.全局引入组件库

import Vant from 'vant'

import  'vant/lib/index.css'

Vue.use(Vant) // 使用Vant

弊端:由于SPA项目打开速度就很慢,

全局引入一个组件库以后速度就会变的更慢

利用babel-plugin-import优雅的引入(按需引入)

1.安装 -D(--save -dev)

npm install babel-plugin-import -D

2.配置 .babellrc

"plugins": [

["import",{"libraryName":"vant","style":true}]

]

3.main.js改造

import {Button} from 'vant'

Vue.use(Button)

 

好处:使得运行速度提升,不会像全局引入一样造成页面加载前的臃肿。

 
 
G
M
T
 
 
检测语言世界语中文简体中文繁体丹麦语乌克兰语乌兹别克语乌尔都语亚美尼亚语伊博语俄语保加利亚语信德语修纳语僧伽罗语克罗地亚语冰岛语加利西亚语加泰罗尼亚语匈牙利语南非祖鲁语卡纳达语卢森堡语印地语印尼巽他语印尼爪哇语印尼语古吉拉特语吉尔吉斯语哈萨克语土耳其语塔吉克语塞尔维亚语塞索托语夏威夷语威尔士语孟加拉语宿务语尼泊尔语巴斯克语布尔语(南非荷兰语)希伯来语希腊语库尔德语弗里西语德语意大利语意第绪语拉丁语拉脱维亚语挪威语捷克语斯洛伐克语斯洛文尼亚语斯瓦希里语旁遮普语日语普什图语格鲁吉亚语毛利语法语波兰语波斯尼亚语波斯语泰卢固语泰米尔语泰语海地克里奥尔语爱尔兰语爱沙尼亚语瑞典语白俄罗斯语科萨科西嘉语立陶宛语索马里语约鲁巴语缅甸语罗马尼亚语老挝语芬兰语苏格兰盖尔语苗语英语荷兰语菲律宾语萨摩亚语葡萄牙语蒙古语西班牙语豪萨语越南语阿塞拜疆语阿姆哈拉语阿尔巴尼亚语阿拉伯语韩语马其顿语马尔加什语马拉地语马拉雅拉姆语马来语马耳他语高棉语齐切瓦语
 
世界语中文简体中文繁体丹麦语乌克兰语乌兹别克语乌尔都语亚美尼亚语伊博语俄语保加利亚语信德语修纳语僧伽罗语克罗地亚语冰岛语加利西亚语加泰罗尼亚语匈牙利语南非祖鲁语卡纳达语卢森堡语印地语印尼巽他语印尼爪哇语印尼语古吉拉特语吉尔吉斯语哈萨克语土耳其语塔吉克语塞尔维亚语塞索托语夏威夷语威尔士语孟加拉语宿务语尼泊尔语巴斯克语布尔语(南非荷兰语)希伯来语希腊语库尔德语弗里西语德语意大利语意第绪语拉丁语拉脱维亚语挪威语捷克语斯洛伐克语斯洛文尼亚语斯瓦希里语旁遮普语日语普什图语格鲁吉亚语毛利语法语波兰语波斯尼亚语波斯语泰卢固语泰米尔语泰语海地克里奥尔语爱尔兰语爱沙尼亚语瑞典语白俄罗斯语科萨科西嘉语立陶宛语索马里语约鲁巴语缅甸语罗马尼亚语老挝语芬兰语苏格兰盖尔语苗语英语荷兰语菲律宾语萨摩亚语葡萄牙语蒙古语西班牙语豪萨语越南语阿塞拜疆语阿姆哈拉语阿尔巴尼亚语阿拉伯语韩语马其顿语马尔加什语马拉地语马拉雅拉姆语马来语马耳他语高棉语齐切瓦语  
 
 
 
 
 
 
 
 
 
文本转语音功能仅限200个字符
 
 
选项 : 历史 : 反馈 : Donate 关闭
[展开全文]

Vue-cli脚手架的搭建

利用npm install vue-cli -g

进行全局安装

vue init webpack <projectName>

初始化项目,需要与要用到的所有基本配置

项目名不支持大写,需改用小写。

npm run dev

运行服务器成功查看界面,至此脚手架搭建完成。

[展开全文]

移动端屏幕适配基础:

固定高度,宽度百分比(过时)

Media Query(媒体查询)

flex布局(结合rem)

 

[展开全文]

引入: 全局引入(不推荐)与按需引入

全局引入会把许多不需要的组件库东西引入过来,造成项目的负担。

 

[展开全文]

https://github.com/shenghy/SmileVue

[展开全文]

vue-cli安装步骤:

打开cmd

e:

cd w

先检查是否安装node  npm -v

如未安装请先安装node

安装好node后

npm install vue-cli -g

vue init webpack

可根据自己需求填写

npm run dev

[展开全文]

Mongodb下载地址:https://www.mongodb.com/download-center#community 

选择 community server 点击下载按钮

[展开全文]