聊聊uniapp中this和that的使用方法

Uniapp是一個跨平台的開發框架，基於Vue.js和微信小程式的開發技術，實作了一次編寫，多端運行。在Uniapp中，this和that是開發者經常使用的兩個變量，用於在不同的情況下取得不同的物件。

this關鍵字是指目前元件的實例，使用this可以直接存取目前元件中的屬性和方法。例如，在元件的methods中，透過this可以存取元件的data對象，如下所示：

export default {
    data() {
        return {
            message: 'Hello World'
        }
    },
    methods: {
        showMessage() {
            console.log(this.message);
        }
    }
}

在上述程式碼中，this.message就是元件中的一個資料屬性，方法showMessage透過this存取message屬性並列印輸出。

that是一個臨時對象，用於在函數內部保存this的值。在某些情況下，函數內部的this並不是指向當前組件的實例，此時可以使用that來保存this的值，以便在函數內部繼續使用。

例如，在使用uni.request向伺服器發起請求時，由於this的指向已經改變，此時需要使用that來保存當前組件的實例，示例如下：

export default {
    data() {
        return {
            items: []
        }
    },
    methods: {
        loadData() {
            //保存当前组件的实例
            let that = this;
            uni.request({
                url: 'http://localhost:8080/getData',
                success(res) {
                    //在此处使用that来访问items属性，而不是this
                    that.items = res.data;
                }
            })
        }
    }
}

在上述在程式碼中，由於uni.request的回呼函數中的this已經不再是當前組件的實例，所以需要使用that來保存當前組件的實例，以便繼續存取和修改組件中的資料。

總之，在Uniapp開發中，this和that的使用是非常重要的，開發者需要清楚地知道它們的用途和使用場景，以便開發高效、穩定和可靠的應用程式。

以上是聊聊uniapp中this和that的使用方法的詳細內容。更多資訊請關注PHP中文網其他相關文章！