git使用
廖雪峰的官網(wǎng)
https://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000
克隆項(xiàng)目:git clone "目標(biāo)倉(cāng)庫(kù)"
1灯荧、創(chuàng)建版本庫(kù):cd到項(xiàng)目目錄下執(zhí)行 git init
2、查看一下狀態(tài):git status
3寺董、添加到版本庫(kù):git add .
4抄淑、提交說(shuō)明:git commit -m "some message"
5、更新:git pull
6馋记、提交: git push
7号坡、撤銷修改:git checkout .
8、提交記錄:git log
9梯醒、版本回退: git reset --hard 3628164
10宽堆、回退到上一個(gè)版本:git reset --hard HEAD^
11、查看所有分支 git branch -a
12茸习、查看當(dāng)前所在分支 git branch
13畜隶、創(chuàng)建并切換分支 git checkout -b dev
14、合并分支 git checkout master git merge dev
15逮光、刪除分支 git branch -d dev
flex布局
Flex 布局教程:語(yǔ)法篇
http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html
Flex 布局教程:實(shí)例篇
http://www.ruanyifeng.com/blog/2015/07/flex-examples.html
目錄結(jié)構(gòu)
文件結(jié)構(gòu)
https://mp.weixin.qq.com/debug/wxadoc/dev/framework/structure.html
注冊(cè)頁(yè)面
注冊(cè)頁(yè)面
https://mp.weixin.qq.com/debug/wxadoc/dev/framework/app-service/page.html
常用方法
data() 頁(yè)面的初始數(shù)據(jù)
onShow() 監(jiān)聽頁(yè)面顯示
setData() 參數(shù)格式接受一個(gè)對(duì)象代箭,以 key,value 的形式表示將 this.data 中的 key 對(duì)應(yīng)的值改變成 value涕刚。
路由
頁(yè)面路由
https://mp.weixin.qq.com/debug/wxadoc/dev/framework/app-service/route.html
路由跳轉(zhuǎn)頁(yè)面
https://mp.weixin.qq.com/debug/wxadoc/dev/api/ui-navigate.html
wx.navigateTo({
url: '../identify/identify'
})
事件處理函數(shù)
事件處理函數(shù)
https://mp.weixin.qq.com/debug/wxadoc/dev/framework/app-service/page.html
點(diǎn)擊事件
bindtap()
傳參獲取跳轉(zhuǎn)
設(shè)置參數(shù)名data-title:
<view bindtap="toDetail" data-title="hello">
toDetail:function(e){
var gettitle=e.currentTarget.dataset.title;(獲取傳過(guò)來(lái)的參數(shù))
帶參數(shù)跳轉(zhuǎn):
wx.navigateTo({
url:"../detail/detail?title="+gettitle
})
}
獲取傳遞的參數(shù)
Page({
data:{
title:''
},
onLoad:function(options){
// 頁(yè)面初始化 options為頁(yè)面跳轉(zhuǎn)所帶來(lái)的參數(shù)
this.setData({
title:options.title
})
},
})
點(diǎn)擊獲取分類信息切換背景
綁定切換id
<view class="classify-left-list {{touchId == item.id ? 'classify-touch' : ''}}" data-classifyId="{{item.id}}" bindtap="getClassList">
// 獲取分類下的課程
getClassList: function (event) {
let that = this;
var classId = event.currentTarget.dataset.classifyid;
util.myrequest({course_class_id: classId},'/course/class/and/price/info','POST',function (res) {
if(res.result) {
that.setData({
price: res.datas.price,
course: res.datas.course,
touchId: classId
})
}else{
// console.log(res.result);
}
})
},
傳遞對(duì)象
傳遞:
var arr = {
courseTitle: courseTitle,
courseId: courseId
};
wx.navigateTo({
url: "../detail/detail?title=" + JSON.stringify(arr)
})
獲任俗邸:
onLoad: function(options) {
let that = this;
let str = JSON.parse(options.title);
let courseId = str.courseId;
this.getDetail(that, courseId);
wx.setNavigationBarTitle({
title: str.courseTitle
})
},
模塊化
模塊化
https://mp.weixin.qq.com/debug/wxadoc/dev/framework/app-service/module.html
(util文件)
1、定義方法
function firstLogin() {}
2杜漠、導(dǎo)出方法
module.exports = {
firstlogin: firstLogin,
}
3极景、引入方法
var util = require('../../utils/util.js');
4、使用方法
util.firstlogin();
請(qǐng)求接口
發(fā)起請(qǐng)求
https://mp.weixin.qq.com/debug/wxadoc/dev/api/network-request.html#wxrequestobject
例子
wx.request({
url: 'test.php', //僅為示例驾茴,并非真實(shí)的接口地址
data: {
x: '' ,
y: ''
},
header: {
'content-type': 'application/json'
},
success: function(res) {
console.log(res.data)
}
封裝方法
function myrequest(data, path, method, cb) {
wx.request({
url: path,
header: { 'content-type': 'application/x-www-form-urlencoded' },
data: data,
method: method,
success: function(res) {
if (typeof cb == "function") {
cb(res.data);
}
},
// 登入失敗
fail: function() {
wx.showModal({
title: '警告',
content: '網(wǎng)絡(luò)異常盼樟!',
success: function(res) {
if (res.confirm) {
// console.log('用戶點(diǎn)擊確定')
}
}
})
},
})
}
使用封裝的方法請(qǐng)求接口
util.myrequest('', '/home/title ', 'GET', function(res) {
if (res.result) {
e.setData({
title: res.datas
})
}
})
動(dòng)態(tài)獲取圖片寬高適應(yīng)屏幕
// 設(shè)置輪播圖自適應(yīng)高度
function imageLoad(e, that, w) {
wx.getSystemInfo({
success: function(res) {
var widths = res.windowWidth; //屏幕寬度
let originalWidth = e.detail.width;
let originalHeight = e.detail.height;
var lunboimg = widths * w / 2.35
that.setData({
lunboimg: lunboimg
})
}
})
}
// 精品課程寬高比16:9
function autoheight(e, that, x, y, z) {
//獲取圖片的原始寬度和高度
wx.getSystemInfo({
success: function(res) {
var autowidth = res.windowWidth; //屏幕寬度
var swiperHeight = (x * autowidth * y) / z
that.setData({
imgheight: swiperHeight
})
}
})
}
.js文件中使用方法
// 輪播圖2.35:1
getImgHeight: function(e) {
var that = this;
util.imgauto(e, that, 1)
},
// 獲取輪播圖
getLunbo: function(e) {
var that = this;
util.myrequest('', '/carousel/info', 'GET', function(res) {
if (res.result) {
e.setData({
reImg: res.datas
})
}
})
},

.wxml中使用
<!-- 輪播圖 -->
<view style="height:{{lunboimg}}px!important;">
<swiper indicator-dots="{{indicatorDots}}" style="height:{{lunboimg}}px!important;" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" circular="{{circular}}">
<block wx:for="{{reImg}}" wx:key="{{reImg}}">
<swiper-item data-port="1" data-courseTitle="貝斯塔" data-courseId="{{item.url}}" bindtap="toDetails">
<image bindload="getImgHeight" style="height:{{lunboimg}}px!important;" src="http://beisita.anasit.com:8888{{item.image}}" />
</swiper-item>
</block>
</swiper>
</view>
<!-- 輪播圖結(jié)束 -->
判斷登陸
https://mp.weixin.qq.com/debug/wxadoc/dev/api/api-login.html#wxloginobject
// 第一次使用小程序調(diào)用登錄注冊(cè)信息
// 是否是第一次注冊(cè)
function firstLogin() {
let that = this;
wx.checkSession({
success: function() {
//session 未過(guò)期,并且在本生命周期一直有效
wx.login({
success: function(res) {
// console.log(res.code)
if (res.code) {
var code = res.code;
that.myrequest({ code: code }, '/user/come/again', 'POST', function(res) {
if (res.result) {
wx.setStorageSync('account', res.datas.account);
wx.setStorageSync('token', res.datas.token);
} else {
wx.navigateTo({
url: '../identify/identify'
})
}
})
} else {
console.log('獲取用戶登錄態(tài)失斝庵痢晨缴!' + res.errMsg)
}
}
})
},
fail: function() {
//登錄態(tài)過(guò)期
wx.login({
success: function(res) {
if (res.code) {
var code = res.code;
// console.log(code);
that.myrequest({ code: code }, '/user/come/again', 'POST', function(res) {
if (res.result) {
} else {
wx.navigateTo({
url: '../identify/identify?code=' + code
})
}
})
} else {
console.log('獲取用戶登錄態(tài)失敗峡捡!' + res.errMsg)
}
}
})
}
})
}
// 檢查是否有token account
function checklogin() {
console.log('token')
var token = wx.getStorageSync('token');
if (!token) {
wx.navigateTo({
url: '../identify/identify'
})
}
}
改名
上線前可以改兩次
上線后不可改名
結(jié)構(gòu)
下載
懶加載
封裝模塊化
路由
傳叁(多叁數(shù))
接收參數(shù)
數(shù)據(jù)處理(this.setData)
圖片寬高比
微信端和手機(jī)端綁定賬號(hào)數(shù)據(jù)打通
flex布局
image背景圖
margin->padding ios樣式錯(cuò)亂
absolute定位