1.scroll-view 橫向不滾動
2.js 中方法之間一定要加上 '怎囚,'
3.scroll-view 兩個方法bindscrolltoupper絮记、bindscrolltolower 調(diào)用問題
4.下拉刷新是顯示導(dǎo)航條動畫和刷新動畫
5.主動觸發(fā)刷新操作
6.播放音頻的方法
7.播放視頻
8.網(wǎng)絡(luò)請求
9.wx.api回調(diào)方法中使用 this.setData({})恢准,提示this.setData is not a function
10.上傳
11.同步戳气、異步、保存嘱巾、讀取數(shù)據(jù)
12.當(dāng)前位置憨琳、選擇位置、查看某一個位置
13.顯示tabbar
14.wx.reLaunch 和 wx.redirectTo
15.動畫
16.page生命周期
17.app.json 配置項列表
18.頁面正向傳值
19.頁面反向傳值,主要使用的是getCurrentPages()
20.頁面內(nèi)部傳值 (data-{key}="{value}")
21.頁面內(nèi)部傳值另一種方法, 設(shè)置 id = {}
22.關(guān)于form bindsubmit 的傳值
23.wx:for wx:if
24.wxs
25.自定義組件
26.自定義js文件
27.page調(diào)用自定義組件內(nèi)部方法
28.setInterval旬昭、setTimeout
1.scroll-view 橫向不滾動
/*
normal: 正常無變化(默認處理方式.文本自動處理換行.假如抵達容器邊界內(nèi)容會轉(zhuǎn)到下一行篙螟;
pre: 保持HTML源代碼的空格與換行,等同與pre標(biāo)簽;
nowrap: 強制文本在一行,除非遇到br換行標(biāo)簽问拘;
*/
.scrollView {
width: 100%;
height: 200px;
background-color: blue;
margin-top: 20px;
overflow: hidden; // 設(shè)置1
white-space: nowrap;// 設(shè)置2
}
.subView {
width: 100%;
height: 200px;
background-color: yellow;
display: inline-block; // 設(shè)置3
}
2.js 中方法之間一定要加上 '遍略,'??
onShareAppMessage: function () {
}, // 重中之重
upper: function (e){
console.log('scrolltoupper',e);
}
3.scroll-view 兩個方法bindscrolltoupper惧所、bindscrolltolower 調(diào)用問題
在默認或設(shè)置的 upper-threshold、lower-threshold 的范圍內(nèi)绪杏,慢慢的拖動scroll-view下愈,upper和lower 會一直觸發(fā),所以不推薦使用這兩個方法進行下拉刷新蕾久、上拉加載操作
<scroll-view class='scrollViewClass'
scroll-y
bindscrolltoupper='upper'
bindscrolltolower='lower'
>
4.下拉刷新是顯示導(dǎo)航條動畫和刷新動畫
onPullDownRefresh: function (){
console.log('onPullDownRefresh')
wx.showNavigationBarLoading() // 顯示導(dǎo)航條動畫
//模擬加載
setTimeout(function () {
// complete
wx.hideNavigationBarLoading() //停止導(dǎo)航條動畫
wx.stopPullDownRefresh() //停止下拉刷新
}, 1500);
},
"enablePullDownRefresh": true, // 允許刷新
"backgroundColor": "#f0145a", // 背景顏色,下拉時可以看見
"backgroundTextStyle": "dark", // 下拉背景字體势似、loading 圖的樣式,僅支持 dark/light僧著,默認light不可見
5.主動觸發(fā)刷新操作
wx.startPullDownRefresh({
success: function () {
console.log('startPullDownRefreshSuccess')
},
fail: function () {
}
})
6.播放音頻的方法
- 帶有界面的履因,使用 audio
<audio id='myaudio'
src='http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E06DCBDC9AB7C49FD713D632D313AC4858BACB8DDD29067D3C601481D36E62053BF8DFEAF74C0A5CCFADD6471160CAF3E6A&fromtag=46'
loop
controls poster='http://y.gtimg.cn/music/photo_new/T002R300x300M000003rsKF44GyaSk.jpg?max_age=2592000'
name='此時此刻'
author='許巍' >
</audio>
onReady: function () {
// 創(chuàng)建上下文
this.audio = wx.createAudioContext('myaudio', this)
},
this.audio.play();
this.audio.pause();
this.audio.seek(14);
- 不帶界面的,適合播放背景音樂(也可以使用wx.getBackgroundAudioManager())
const innerAudioContext = wx.createInnerAudioContext()
innerAudioContext.autoplay = true
innerAudioContext.src = 'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E061FF02C31F716658E5C81F5594D561F2E88B854E81CAAB7806D5E4F103E55D33C16F3FAC506D1AB172DE8600B37E43FAD&fromtag=46'
innerAudioContext.onPlay(() => {
console.log('開始播放')
})
innerAudioContext.onError((res) => {
console.log(res.errMsg)
console.log(res.errCode)
})
// 在其他的方法里面可以使用 this.innerAudioContext控制音頻的播放狀態(tài)
this.innerAudioContext = innerAudioContext;
// 在不需要播放的時候 destroy
// this.innerAudioContext. destroy();
this.innerAudioContext.play();
this.innerAudioContext.pause();
this.innerAudioContext.seek(14);
7.播放視頻
<video id="myVideo"
src="http://wxsnsdy.tc.qq.com/105/20210/snsdyvideodownload?filekey=30280201010421301f0201690402534804102ca905ce620b1241b726bc41dcff44e00204012882540400&bizid=1023&hy=SH&fileparam=302c020101042530230204136ffd93020457e3c4ff02024ef202031e8d7f02030f42400204045a320a0201000400"
danmu-list="{{danmuList}}"
enable-danmu
danmu-btn
controls>
</video>
<view>
<input bindblur="bindInputBlur"/>
<button bindtap="bindSendDanmu">發(fā)送彈幕</button>
<button type='primary' bindtap='play'>開始</button>
<button type='primary' bindtap='pause'>暫停</button>
<button type='primary' bindtap='video50'>設(shè)置播放時間到14秒</button>
<button type='primary' bindtap='videoRate'>設(shè)置倍速</button>
</view>
data: {
inputValue: '',
danmuList: [
{
text: '第 1s 出現(xiàn)的彈幕',
color: '#ff0000',
time: 1
},
{
text: '第 3s 出現(xiàn)的彈幕',
color: '#ff00ff',
time: 3
}]
},
onReady: function () {
this.videoContext = wx.createVideoContext('myVideo', this)
},
bindInputBlur: function (e) {
this.inputValue = e.detail.value
},
// 發(fā)送彈幕
bindSendDanmu: function () {
this.videoContext.sendDanmu({
text: this.inputValue,
color: getRandomColor()
})
},
play: function () {
this.videoContext.play();
},
pause: function () {
this.videoContext.pause();
},
video50: function () {
this.videoContext.seek(50);
},
videoRate: function () {
this.videoContext.playbackRate(1.5);
},
8.網(wǎng)絡(luò)請求
request: function (){
const requestTask = wx.request({
url: 'http://baobab.kaiyanapp.com/api/v1/feed',
data:{
'num': 1
},
header:{
'type': 'application/json'
},
method: 'POST',
success: function(result){
// 需根據(jù)返回的狀態(tài)碼自行判斷是否請求成功 200盹愚、400栅迄、500、504等等
console.log('成功', result)
},
fail: function(error){
console.log('失敗',error)
},
complete: function(){
console.log('完成')
}
});
// 中斷請求任務(wù)
// requestTask.abort();
}
9.wx.api回調(diào)方法中使用 this.setData({})皆怕,提示this.setData is not a function
??方法體外部定義 var that = this;
??方法體內(nèi)部使用that.setData({})
var that = this;
wx.chooseImage({
count: 1, // 默認9
sizeType: ['original', 'compressed'], // 可以指定是原圖還是壓縮圖毅舆,默認二者都有
sourceType: ['album', 'camera'], // 可以指定來源是相冊還是相機,默認二者都有
success: function (res) {
// 返回選定照片的本地文件路徑列表愈腾,tempFilePath可以作為img標(biāo)簽的src屬性顯示圖片
that.setData({
tempFilePaths: res.tempFilePaths
});
console.log('成功', res)
}
})
10.上傳
upload: function () {
var that = this;
wx.chooseImage({
count: 1, // 默認9
sizeType: ['original', 'compressed'], // 可以指定是原圖還是壓縮圖憋活,默認二者都有
sourceType: ['album', 'camera'], // 可以指定來源是相冊還是相機,默認二者都有
success: function (res) {
// 返回選定照片的本地文件路徑列表顶滩,tempFilePath可以作為img標(biāo)簽的src屬性顯示圖片
that.setData({
tempFilePaths: res.tempFilePaths
})
console.log('成功', res)
that.upload1(res.tempFilePaths[0])
}
})
},
upload1: function (filePath){
const uploadTask = wx.uploadFile({
url: 'http:...',
filePath: filePath,
name: 'image',
header: {
'type': 'multipart/form-data'
},
formData: {
'photo': '參數(shù)1',
'phoneNum': '參數(shù)2',
},
success: function (result) {
console.log('成功', result)
},
fail: function (error) {
console.log('失敗', error)
},
complete: function (res) {
console.log('完成')
},
})
// 上傳進度
uploadTask.onProgressUpdate((res)=>{
console.log('onProgressUpdate',res)
console.log('上傳百分比:', res.progress+'%')
})
// uploadTask.abort() // 取消上傳任務(wù)
}
11.同步余掖、異步、保存礁鲁、讀取數(shù)據(jù)
wx.setStorage({
key: 'key1',
data: 'value1',
success: function(res) {
console.log('異步保存數(shù)據(jù)成功')
},
fail: function(res) {},
complete: function(res) {},
})
try{
wx.setStorageSync('key2', 'value2')
}catch(e){
}
console.log('同步保存數(shù)據(jù)成功')
wx.getStorage({
key: 'key1',
success: function(res) {
console.log('異步獲取數(shù)據(jù)成功:',res)
},
fail: function(res) {},
complete: function(res) {},
})
var value = wx.getStorageSync('key2')
console.log('同步獲取數(shù)據(jù)成功:',value)
12.當(dāng)前位置盐欺、選擇位置、查看某一個位置
// 當(dāng)前位置(經(jīng)緯度仅醇、速度冗美、精度、高度)
wx.getLocation({
type: 'wsg84',
altitude: true,
success: function(res) {
console.log('獲取當(dāng)前位置成功',res)
},
fail: function(res) {},
complete: function(res) {},
})
// 選擇位置,彈出地圖界面(模糊搜索析二、拖動地圖選擇位置粉洼、當(dāng)前位置附近的建筑)
wx.chooseLocation({
success: function(res) {
console.log('選擇當(dāng)前位置成功', res)
},
fail: function(res) {},
complete: function(res) {},
})
//使用微信內(nèi)置地圖查看位置
wx.openLocation({
latitude: 39.965985,
longitude: 116.289073,
scale: 12,
name: '火器營[地鐵站]',
address: '北京市海淀區(qū)地鐵10號線',
success: function(res) {},
fail: function(res) {},
complete: function(res) {},
})
13.顯示tabbar
// 所有的頁面都要在pages里面進行注冊
"pages":[
"pages/index/index",
"pages/apiTest/apiTest"
],
"window":{
"backgroundTextStyle":"light",
"navigationBarBackgroundColor": "#f0145a",
"navigationBarTitleText": "WeChat",
"navigationBarTextStyle":"black"
},
"tabBar": {
"color": "#000000",
"selectedColor": "red",
"borderStyle": "black",
"backgroundColor": "white",
"list": [
{
"pagePath": "pages/index/index",
"text": "tab2",
"iconPath": "iconPath",
"selectedIconPath": "selectedIconPath"
},
{
"pagePath": "pages/apiTest/apiTest",
"text": "tab1",
"iconPath": "iconPath",
"selectedIconPath": "selectedIconPath"
}
]
}
14. wx.reLaunch 和 wx.redirectTo
??wx.reLaunch:關(guān)閉所有頁面,打開到應(yīng)用內(nèi)的某個頁面叶摄,無法返回
??wx.redirectTo:關(guān)閉當(dāng)前頁面属韧,跳轉(zhuǎn)到應(yīng)用內(nèi)的某個頁面,可以返回
15.動畫
<view class='view' animation='{{animation}}' bindlongpress='longTag'></view>
animal:function (){
// ??1.創(chuàng)建一個動畫實例animation
/**
linear 動畫從頭到尾的速度是相同的
ease 動畫以低速開始蛤吓,然后加快宵喂,在結(jié)束前變慢
ease-in 動畫以低速開始
ease-in-out 動畫以低速開始和結(jié)束
ease-out 動畫以低速結(jié)束
step-start 動畫第一幀就跳至結(jié)束狀態(tài)直到結(jié)束
step-end 動畫一直保持開始狀態(tài),最后一幀跳到結(jié)束狀態(tài)
*/
const animation = wx.createAnimation({
duration: 1000,
timingFunction: 'ease',
})
// ??2.調(diào)用實例的方法來描述動畫
/**
* 樣式
opacity value 透明度会傲,參數(shù)范圍 0~1
backgroundColor color 顏色值
width length 長度值锅棕,如果傳入 Number 則默認使用 px拙泽,可傳入其他自定義單位的長度值
height length 長度值,如果傳入 Number 則默認使用 px裸燎,可傳入其他自定義單位的長度值
top length 長度值顾瞻,如果傳入 Number 則默認使用 px,可傳入其他自定義單位的長度值
left length 長度值德绿,如果傳入 Number 則默認使用 px荷荤,可傳入其他自定義單位的長度值
bottom length 長度值,如果傳入 Number 則默認使用 px脆炎,可傳入其他自定義單位的長度值
right length 長度值梅猿,如果傳入 Number 則默認使用 px,可傳入其他自定義單位的長度值
*/
/**
* 旋轉(zhuǎn)
rotate deg deg的范圍-180~180秒裕,從原點順時針旋轉(zhuǎn)一個deg角度
rotateX deg deg的范圍-180~180,在X軸旋轉(zhuǎn)一個deg角度
rotateY deg deg的范圍-180~180钞啸,在Y軸旋轉(zhuǎn)一個deg角度
rotateZ deg deg的范圍-180~180几蜻,在Z軸旋轉(zhuǎn)一個deg角度
rotate3d (x,y,z,deg) 同transform-function rotate3d
*/
/**
* 縮放
scale sx,[sy] 一個參數(shù)時,表示在X軸体斩、Y軸同時縮放sx倍數(shù)梭稚;兩個參數(shù)時表示在X軸縮放sx倍數(shù),在Y軸縮放sy倍數(shù)
scaleX sx 在X軸縮放sx倍數(shù)
scaleY sy 在Y軸縮放sy倍數(shù)
scaleZ sz 在Z軸縮放sy倍數(shù)
scale3d (sx,sy,sz) 在X軸縮放sx倍數(shù)絮吵,在Y軸縮放sy倍數(shù)弧烤,在Z軸縮放sz倍數(shù)
*/
/**
* 偏移
translate tx,[ty] 一個參數(shù)時,表示在X軸偏移tx蹬敲,單位px暇昂;兩個參數(shù)時,表示在X軸偏移tx伴嗡,在Y軸偏移ty急波,單位px。
translateX tx 在X軸偏移tx瘪校,單位px
translateY ty 在Y軸偏移tx澄暮,單位px
translateZ tz 在Z軸偏移tx,單位px
translate3d (tx,ty,tz) 在X軸偏移tx阱扬,在Y軸偏移ty泣懊,在Z軸偏移tz,單位px
*/
/**
* 傾斜
skew ax,[ay] 參數(shù)范圍-180~180麻惶;一個參數(shù)時馍刮,Y軸坐標(biāo)不變,X軸坐標(biāo)延順時針傾斜ax度用踩;兩個參數(shù)時渠退,分別在X軸傾斜ax度忙迁,在Y軸傾斜ay度
skewX ax 參數(shù)范圍-180~180;Y軸坐標(biāo)不變碎乃,X軸坐標(biāo)延順時針傾斜ax度
skewY ay 參數(shù)范圍-180~180姊扔;X軸坐標(biāo)不變,Y軸坐標(biāo)延順時針傾斜ay度
*/
/**
* 矩陣變形
matrix (a,b,c,d,tx,ty) 同transform-function matrix
matrix3d 同transform-function matrix3d
*/
animation.scale(2, 2)
.rotate(45)
.step() // ??step表示一組動畫的完成,動畫同時播放
// ??分開寫則按順序播放動畫
animation.opacity(0.5)
.backgroundColor('blue').step()
// ??step 可以傳入一個跟 wx.createAnimation() 一樣的配置參數(shù)
// ??可以指定當(dāng)前動畫的配置屬性
animation.width(200).step({ duration: 2000, timingFunction: 'linear'})
//??3.最后通過動畫實例的export方法導(dǎo)出動畫數(shù)據(jù)傳遞給組件的animation屬性
this.setData({
animation: animation.export()
})
}
16.page生命周期
17.app.json 配置項列表
18.頁面正向傳值
// ??傳object對象梅誓,將object轉(zhuǎn)成字符串傳遞
var info = [{ id: '1', name: '餃子', price: '299元' },
{ id: '2', name: '面包', price: '99元' },
{ id: '3', name: '面條', price: '199元' },
{ id: '4', name: '饅頭', price: '499元' },
{ id: '5', name: '熱菜', price: '2999元' }]
或
var info = { id: '123', name: '餃子', price: '299元' }
wx.navigateTo({
url: '../viewTest/viewTest?goodInfo=' + JSON.stringify(info),
})
// ??傳單個數(shù)據(jù)
wx.navigateTo({
url: '../viewTest/viewTest?goodInfo=' + 'beautiful',
})
onLoad: function (options) {
// ??將字符串轉(zhuǎn)成object
var info = JSON.parse(options.goodInfo);
console.log('info:', info.id)
console.log('info:', info.name)
console.log('info:', info.price)
// ??單個value直接輸出對應(yīng)的key即可
console.log('info:',options.goodInfo)
},
19.頁面反向傳值,主要使用的是getCurrentPages()
??getCurrentPages()獲取頁面棧,第一個元素為首頁,最后一個元素為當(dāng)前頁面
??var currentPage = arr[arr.length - 1],這個是獲取的當(dāng)前頁面
??var upPage = arr[arr.length - 2],這個是獲取的上一個頁面
??使用 upPage 可以操作上一個頁面內(nèi)部的方法等恰梢,比如可以setData,可以調(diào)用page里面的方法
??反向傳值就是使用的這種方法梗掰,調(diào)用setData
當(dāng)前頁面
var arr = getCurrentPages();
console.log('upPages路徑:', arr[arr.length-2].route);
var upPage = arr[arr.length - 2]
// ??1.可以調(diào)用上一個頁面的方法進行傳值
upPage.nextPageCallingThisClick('哈哈嵌言,這是從下一個頁面?zhèn)鬟^來的值')
// ??2.調(diào)用上一個頁面的setData方法進行傳值
wx.navigateBack({
success:function(){
upPage.setData({
nextComeValue: '這是從下一個頁面?zhèn)鬟^來的值'
})
}
})
}
上一個頁面
// ??onShow方法會被調(diào)用,進行賦值操作
onShow:function(){
console.log('nextComeValue1111111=',this.data.nextComeValue)
this.setData({
nextComeValue: this.data.nextComeValue
})
},
// ??下一個頁面調(diào)用當(dāng)前頁面的方法進行傳值
nextPageCallingThisClick:function(value){
console.log('nextPageCallingThisClick=', value)
this.setData({
nextComeValue1: value
})
}
20.頁面內(nèi)部傳值 (data-{key}="{value}")
比如有好幾個標(biāo)簽及穗,通過wx:for 添加摧茴,點擊標(biāo)簽獲取標(biāo)簽的內(nèi)容
click: function (e){
console.log(e)
console.log(e.currentTarget.dataset.price)
console.log(e.currentTarget.dataset.title)
}
21.頁面內(nèi)部傳值另一種方法, 設(shè)置 id = {}
<text id='{{index}}' data-title='{{item.name}}' data-price='{{item.price}}' bindtap='click'>
// 根據(jù)得到的 id,去data里面找對應(yīng)的具體數(shù)據(jù)
var id = e.currentTarget.id;
22.關(guān)于form bindsubmit 的傳值
??form 的內(nèi)部組件需要設(shè)置 name 屬性
<input name='input' >
<slider name='slider'>
<switch name='switch' >
23.wx:for wx:if
<view wx:for="{{list}}" wx:item="item" wx:index="index">
<view class='subView' wx:if='{{item.price < 1000}}'>
<text id='{{index}}' data-title='{{item.name}}' data-price='{{item.price}}' bindtap='click'>{{index+1}}. {{item.name}} : {{item.price}}元</text>
</view>
<block wx:else>
<view class='subView' >
<text>大于1000元的食品</text>
<text id='{{index}}' data-title='{{item.name}}' data-price='{{item.price}}' bindtap='click'>{{index+1}}. {{item.name}} : {{item.price}}元</text>
</view>
</block>
</view>
因為 wx:if 是一個控制屬性埂陆,需要將它添加到一個標(biāo)簽上苛白。
如果要一次性判斷多個組件標(biāo)簽,可以使用一個 <block/> 標(biāo)簽將多個組件包裝起來焚虱,
并在上邊使用 wx:if 控制屬性购裙。
因為 wx:if 之中的模板也可能包含數(shù)據(jù)綁定,
所有當(dāng) wx:if 的條件值切換時鹃栽,
框架有一個局部渲染的過程躏率,
因為它會確保條件塊在切換時銷毀或重新渲染。
同時 wx:if 也是惰性的民鼓,
如果在初始渲染條件為 false薇芝,
框架什么也不做,
在條件第一次變成真的時候才開始局部渲染摹察。
相比之下恩掷,hidden 就簡單的多,
組件始終會被渲染供嚎,只是簡單的控制顯示與隱藏黄娘。
一般來說,wx:if 有更高的切換消耗而 hidden 有更高的初始渲染消耗克滴。
因此逼争,如果需要頻繁切換的情景下,用 hidden 更好劝赔,
如果在運行時條件不大可能改變則 wx:if 較好誓焦。
24.wxs
??WXS增強了wxml的功能,相當(dāng)于頁面中的腳本語言,
我們可以將比如檢查手機格式杂伟、郵箱格式的函數(shù)放在wxs中來使用(根據(jù)是否正確來改變相應(yīng)的樣式)移层,
而不用跑到在js中去檢查。
??wxs目前似乎并不支持ES6(至少let不能使用)
??wxs文件不能被js文件引用赫粥。wxml文件能引用wxs文件观话。
wxs
var appent = function (value){
return value+'元'
}
var message = 'hello world'
module.exports = {
appent: appent,
message: message
}
wxml
<wxs src="./appentYuan.wxs" module="util" />
或者
<wxs module="m1">
var msg = "hello world";
module.exports.message = msg;
</wxs>
<view wx:for='{{prices}}'>
<text>{{util.appent(item)}}</text>
<view> {{m1.message}} </view>
</view>
比如:輸入框里面要輸入郵箱,正確的郵箱輸入框顏色為綠色越平,不正確的郵箱輸入框顏色為紅色,就可以使用wxs來判斷
// 正則來檢驗郵箱是否有效
var isEmail = function(email) {
var reg = getRegExp('^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$')
return reg.test(email)
}
module.exports = {
isEmail: isEmail
}
<wxs src="./inputValidate.wxs" module="util" />
// 這個應(yīng)該放在 style 里面進行判斷...
<input class="{{util.isEmail(email)?'email_input_success':'email_input_error'}}"
placeholder='請輸入郵箱' value='{{email}}' bindinput='emailInputClick' />
25.自定義組件
26.自定義js文件
1.新建js文件
/**
* request 有一個參數(shù) {}
*
* url: 網(wǎng)絡(luò)請求地址
* data: 網(wǎng)絡(luò)請求參數(shù)
* success: 網(wǎng)絡(luò)請求成功回調(diào)
* fail: 網(wǎng)絡(luò)請求失敗回調(diào)
* complete: 網(wǎng)絡(luò)請求完成回調(diào)
*
*/
const request = ({ url: url, data: data, success: success, fail: fail, complete: complete }) => {
const requestTask = wx.request({
url: url,
data: data,
header: {
'type': 'application/json'
},
method: 'POST',
success: function (result) {
// 需根據(jù)返回的狀態(tài)碼自行判斷是否請求成功 200频蛔、400、500秦叛、504等等
console.log('http成功', result)
success()
},
fail: function (error) {
console.log('http失敗', error)
fail()
},
complete: function () {
console.log('http完成')
complete()
}
});
}
module.exports = {
request: request
}
2.在需要的地方引用
??var httpRequest = require('../../utils/http.js')
/**
* 生命周期函數(shù)--監(jiān)聽頁面初次渲染完成
*/
onReady: function () {
console.log('onReady');
httpRequest.request({
url: 'http://',
data: {
'num': 1
},
success: (result) => {
console.log('成功', result)
},
fail: (error) => {
console.log('失敗', error)
},
complete: () => {
console.log('完成')
}
})
},
27.page調(diào)用自定義組件內(nèi)部方法
this.selectComponent("#componentID").componentFunc();
page
<questionItem id="questionItem" />
questionItem
<view animation='{{animation}}'>
...
</view>
showAnimation: function () {
...
}
調(diào)用
this.selectComponent("#questionItem").showAnimation();