1.發(fā)送request請(qǐng)求：
image.png
解決辦法：在設(shè)置中找到項(xiàng)目設(shè)置
image.png
2.創(chuàng)建新頁(yè)面的時(shí)候必須在js文件中注冊(cè)到Page（{}）中：
// pages/component/index.js.js
Page({
/**
* 頁(yè)面的初始數(shù)據(jù)
*/
data: {
},
/**
* 生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面加載
*/
onLoad: function (options) {
},
/**
* 生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面顯示
*/
onShow: function () {
},
/**
* 生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面隱藏
*/
onHide: function () {
},
/**
* 生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面卸載
*/
onUnload: function () {
},
/**
* 頁(yè)面相關(guān)事件處理函數(shù)--監(jiān)聽(tīng)用戶下拉動(dòng)作
*/
onPullDownRefresh: function () {
},
/**
* 頁(yè)面上拉觸底事件的處理函數(shù)
*/
onReachBottom: function () {
},
/**
* 用戶點(diǎn)擊右上角分享
*/
onShareAppMessage: function () {
},
// 跳轉(zhuǎn)查看全部課程
jumpAllClass(){
wx.navigateTo({
url: '../../pages/class/index?id=1',
})
},
clickRequest(){
}
})
3.微信登錄：
image.png
https://blog.csdn.net/michael_ouyang/article/details/72635263
獲取用戶信息是由于微信api調(diào)整：
image.png
4.下拉刷新：
wxml:
<!-- 下拉刷新 -->
<view class="page-body">
<view class="page-body-wrapper">
<view class="page-body-info">
<text class="page-body-text">下滑頁(yè)面即可刷新</text>
</view>
<view class="page-body-buttons">
<button bindtap="stopPullDownRefresh">停止刷新</button>
</view>
</view>
</view>
json:
"enablePullDownRefresh": true
js:
onPullDownRefresh: function() {
console.log('onPullDownRefresh', new Date())
},
stopPullDownRefresh: function() {
wx.stopPullDownRefresh({
complete: function(res) {
console.log(res, new Date())
}
})
},
5.頂部標(biāo)題顯示加載
header.wxml:
<template>
<view>
{{title}}
</view>
</template>
需要加載的文件中引入：
<import src="../common/header.wxml"/>
<!--pages/class/index.wxml-->
<template is="header" data="{{title: 'navigationBarLoading'}}"/>
<button class="page-body-button" type="primary" bindtap="showNavigationBarLoading">顯示加載動(dòng)畫(huà)</button>
<button class="page-body-button" bindtap="hideNavigationBarLoading">隱藏加載動(dòng)畫(huà)</button>
js:
showNavigationBarLoading: function() {
wx.showNavigationBarLoading()
},
hideNavigationBarLoading: function() {
wx.hideNavigationBarLoading()
}
6.menulist:
<view class="menu-list">
<block wx:for="{{menuList}}" wx:for-item="menuItem">
<view class="menu-item">
<view class="menu-item-main" id="{{index}}" bindtap="tapMenuItem">
<text class="menu-item-name">{{menuItem.name}}</text>
<image
class="menu-item-arrow {{menuItem.opened ? 'open' : 'close'}} {{menuItem.url ? 'url' : ''}}"
src="../../image/arrowright.png">
</image>
</view>
<!-- <view class="menu-item-api-list {{menuItem.opened ? 'open' : 'close'}}">
<block wx:for="{{menuItem.APIList}}" wx:for-item="APIItem">
<navigator url="{{APIItem.url}}">
<view class="menu-item-api-item" style="{{index === 0 ? 'border-top:none;' : ''}}">
<view class="menu-item-api-item-text">
<text class="menu-item-api-item-text-zhname">{{APIItem.zhName}}</text>
<text class="menu-item-api-item-text-enname">{{APIItem.enName}}</text>
</view>
<image class="menu-item-api-item-arrow" src="/image/arrowright.png"></image>
</view>
</navigator>
</block>
</view> -->
<text class="menu-item-api-list {{menuItem.opened ? 'open' : 'close'}}">
我在測(cè)試數(shù)據(jù)我在測(cè)試數(shù)據(jù)我在測(cè)試數(shù)據(jù)我在測(cè)試數(shù)據(jù)我在測(cè)試數(shù)據(jù)我在測(cè)試數(shù)據(jù)我在測(cè)試數(shù)據(jù)我在測(cè)試數(shù)據(jù)我在測(cè)
我在測(cè)試數(shù)據(jù)我在測(cè)試數(shù)據(jù)我在測(cè)試數(shù)據(jù)我在測(cè)試數(shù)據(jù)我在測(cè)試數(shù)據(jù)試數(shù)據(jù)我在測(cè)試數(shù)據(jù)
</text>
</view>
</block>
</view>
wxss:
.menu-list {
display: flex;
flex-direction: column;
background-color: #fbf9fe;
}
.menu-item {
color: #000000;
display: flex;
background-color: #fff;
margin: 10rpx 40rpx;
flex-direction: column;
}
.menu-item-main {
display: flex;
height: 100rpx;
padding: 20rpx;
border-radius: 10rpx;
align-items: center;
font-size: 32rpx;
justify-content: space-between;
}
.menu-item-arrow {
width: 32rpx;
height: 32rpx;
transition: 400ms;
}
.menu-item-arrow.open {
transform: rotate(90deg);
}
.menu-item-arrow.close {
transform: rotate(0deg);
}
.menu-item-arrow.url {
transform: rotate(0deg);
}
.menu-item-api-list {
transition: 200ms;
height: auto;
border-top: 1px solid #d8d8d8;
}
.menu-item-api-list.close {
display: none;
height: 0;
}
.menu-item-api-item {
display: flex;
justify-content: space-between;
height: 80rpx;
padding: 20rpx 20rpx 20rpx 0;
margin-left: 20rpx;
align-items: center;
border-top: 1px solid #f0f0f0;
}
.menu-item-api-item-text {
display: flex;
flex-direction: column;
justify-content: space-between;
height: 100%;
}
.menu-item-api-item-text-zhname {
font-size: 30rpx;
}
.menu-item-api-item-text-enname {
font-size: 26rpx;
color: #6b6b6b;
}
.menu-item-api-item-arrow {
width: 32rpx;
height: 32rpx;
}
js:
tapMenuItem: function (e) {
var menuItem = this.data.menuList[parseInt(e.currentTarget.id)]
if (menuItem.url) {
wx.navigateTo({ url: menuItem.url })
} else {
var changeData = {}
var opened = menuItem.opened
changeData['menuList[' + e.currentTarget.id + '].opened'] = !opened
this.setData(changeData)
}
}
image.png
7.toast彈框：
wx.showToast({
title: '成功',
icon: 'succes',
duration: 1000,
mask: true
})
8.方法傳值：
bindtap="navigateJump" data-index="{{menuItem.url}}"
navigateJump(event) {
wx.navigateTo({
url: event.currentTarget.dataset.index,
})
},
9.獲取input的value：
<input class="inp" bindinput="inputVal"></input>
inputVal(e:object){
this.setData({
inputValue: e.detail.value
})
},
