课程介绍
1、如何搭建一个小程序,并发布
2、如何开发自己的商城
必备的前端知识点
1、html
2、css
3、js
开发前准备
1、申请帐号
点击(https://mp.weixin.qq.com/wxopen/waregister?action=step1)
根据指引填写信息和提交相应的资料,就可以拥有自己的小程序帐号。
2、安装开发工具
https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html?t=2018614
小程序结构
1、目录
1、文件结构
小程序包含一个描述整体程序的 app 和多个描述各自页面的 page。
一个小程序主体部分由三个文件组成,必须放在项目的根目录,如下:
2、页面目录结构
一个小程序页面由四个文件组成,分别是:
配置
1、全局配置
app.json文件用来对微信小程序进行全局配置,决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。
2、子页面配置
创建页面
1、如何创建一个页面
2、页面的结构
组件介绍
1、web-view
2、表单
3、cover-view
4、swiper
5、image
api介绍
1、网络请求
2、数据缓存
3、交互反馈
4、设置导航条
5、设置tabBar
6、设置窗口背景
路由
可带参:navigateTo、redirectTo、reLaunch(path?key=value&key2=value2)
不可带参:switchTab (本地、全局变量)
传参
设置参数名data-title:
toDetail:function(e){
var gettitle=e.currentTarget.dataset.title;(获取传过来的参数)
带参数跳转:
wx.navigateTo({
url:"../detail/detail?title="+gettitle
})
}
数组传参: url: "../detail/detail?title=" + JSON.stringify(arr)
获取传递过来的参数
Page({
data:{
title:''
},
onLoad:function(options){
// 页面初始化 options为页面跳转所带来的参数
this.setData({
title:options.title
})
},
})
接收数组参:var str = JSON.parse(options.title);
模版
模块化
请求
function myrequest(data, path, method, cb) {
wx.request({
url: purl + path,
header: { 'content-type': 'application/x-www-form-urlencoded' },
data: data,
method: method,
success: function(res) {
if (typeof cb == "function") {
cb(res.data);
}
},
})
}
module.exports = {
myrequest: myrequest,
}
数据处理
引入请求方法:var util = require('../../utils/util.js');//不能用绝对路径
调用方法: // 获取详情
getDetail: function() {
util.myrequest({ id: this.data.id }, '/exhibition/detail', 'GET', (res) => {
this.setData({
newDetail: res.datas
})
})
},
使用:this.data.datas.key
admin数据字典建设
1、数据表的创建
2、需要哪些基本表
商城讲解
通过商城把上诉内容串联是来
分类
详情
购物车
订单
收藏
足迹
个人信息
支付
小程序如何使用微信支付
flex布局
Flex 布局教程:语法篇
http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html
Flex 布局教程:实例篇
http://www.ruanyifeng.com/blog/2015/07/flex-examples.html
商城练习
使用教程提供的接口,开发一个简易商城,并发布
注意点
背景图片:不能使用本地图片
code:一个code智能使用一次
保存:不能使用线上路径(先下载后保存)
navigateTo:最多5级目录跳转
图片上传:需要配置安全证书
请求数量:不能超过十个并发实际五个
改名:发布前可以改两次发布之后不可以更改(重新认证交300)
头像:一个月五次
介绍:一个月五次
服务类目:一个月三次
限制
不能分享到朋友圈
不能诱导分享
分享之后不能判断是否分享成功
不能主动推送消息通知
富文本效果不理想