Taro-定位及向下滾動加載

定位

使用 Taro 提供的API

// 提前將微信小程序的JSSDK準備好放到項目中
import AAMapWX from '../../../plugins/wxmap/qqmap-wx-jssdk'

Taro.getLocation({
    type: 'wgs84',
    success: function (res) {
        const latitude = res.latitude
        const longitude = res.longitude
        const speed = res.speed
        const accuracy = res.accuracy
        // 獲取到經緯度以後調用微信小程序的SDK
        // 實例化API核心類
        var qqmapsdk = new QQMapWX({
            key: '自己申請的騰訊地圖key'
        })
        
        // 使用小程序API直接解析獲取當前位置
        qqmapsdk.reverseGeocoder({
            location: {
                latitude,
                longitude
            },
            success: function (res) {
                let location = res.result.address
                console.log(loaction)
            }
        })
    }
})

下拉上拉加載

Taro 有提供這兩種的API,但是兼容性不是很好,有的只支持微信小程序的,不兼容H5的,所以我只找了兩個都兼容的。

// onScrollToLower 方法在組件 <ScrollView> 上調用,然後可以自定義方法,也可以調用下拉刷新的API

onScrollToLower = (e) => {
    // 計算當前有多少頁數
    let pageTotal = Math.ceil(this.state.total / 10);

    // newPageNum 需要傳遞給後端的 pageNum
    let newPageNum = this.state.pageNum + 1
    // 如果 newPageNum 大於了當前的總頁數,說明數據加載完畢
    if (newPageNum > pageTotal) {
        Taro.showToast({
            title: '無更多數據'
        })
    } else {
    	// 加載數據, 並將加載動畫關閉
        Taro.hideLoading()
    }
}

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章