百度智能小程序 延遲執(zhí)行

swan.nextTick

基礎(chǔ)庫 3.15.104 開始支持，低版本需做兼容處理。

解釋：延遲一部分操作到下一個(gè)時(shí)間片再執(zhí)行。（類似于 setTimeout）

方法參數(shù)

Function callback

callback參數(shù)說明

自定義組件中的 setData 和 triggerEvent 等接口為同步操作，當(dāng)這幾個(gè)接口被連續(xù)調(diào)用時(shí)，都是在一個(gè)同步流程中執(zhí)行完的，因此若邏輯不當(dāng)可能會(huì)導(dǎo)致出錯(cuò)。

舉例 ：當(dāng)父組件的 setData 引發(fā)了子組件的 triggerEvent，進(jìn)而使得父組件又進(jìn)行了一次 setData，期間有通過 s-if 語句對(duì)子組件進(jìn)行卸載，就有可能引發(fā)奇怪的錯(cuò)誤，所以對(duì)于不需要在一個(gè)同步流程內(nèi)完成的邏輯，可以使用此接口延遲到下一個(gè)時(shí)間片再執(zhí)行。

圖片示例

代碼示例 1 

在開發(fā)者工具中打開

// 自定義組件邏輯 (custom.js)
Component({
    properties: {
        name: {
            type: String,
            value: 'swan'
        }
    },
    data: {
        age: 1,
        number: ''
    },
    methods: {
        nextTick() {
            swan.showToast({
                title: '在控制臺(tái)或者sConsole中查看執(zhí)行順序',
                icon: 'none'
            });
            this.setData({number: 1}) // 直接在當(dāng)前同步流程中執(zhí)行
            console.log(this.data.number);
            swan.nextTick(() => {
                this.setData({number: 3}) // 在當(dāng)前同步流程結(jié)束后，下一個(gè)時(shí)間片執(zhí)行         
                console.log(this.data.number);
            })
            this.setData({number: 2}) // 直接在當(dāng)前同步流程中執(zhí)行
            console.log(this.data.number);
        }
    }
});

代碼示例 2: 常用用法 

在開發(fā)者工具中打開

<view>
    <view>{{name}}</view>
    <button bindtap="getStorage">點(diǎn)擊賦值</button>
</view>

Page({
    data: {
        name: 'swan',
        renderEnd: true
    },
    getStorage(){
        this.setData({
            name: 'smartApp'
        }, () => {
            console.log('異步流程', this.data.renderEnd);
        });
        console.log('當(dāng)前時(shí)間片', this.data.renderEnd);
        swan.nextTick(() => {
            this.data.renderEnd = false; // 在當(dāng)前同步流程結(jié)束后，下一個(gè)時(shí)間片執(zhí)行
            console.log('nextTick時(shí)間片', this.data.renderEnd);
        });
    }
});