JSONP 是一種利用 script 標簽的跨域技術，可以讓我們在前端代碼中從其他網站獲取數據。在 Vue.js 中，JSONP 被廣泛應用于與后端 API 進行數據交互。

JSONP 原理非常簡單，所謂 JSONP 實際上是一種約定，即約定使用 callback 參數來指定一個回調函數。隨后，服務端會將要傳遞給前端的 JSON 數據放在一個函數調用中作為參數返回，而這個函數就是前端指定的回調函數。前端代碼接收到響應后，就可以直接執行回調函數，并將返回的數據作為參數傳遞進去。

function jsonp(url, callback) {
// 創建 script 標簽并加入到頁面中
var script = document.createElement('script')
script.setAttribute('src', url)
document.body.appendChild(script)
// 創建回調函數
window[callback] = function(data) {
document.body.removeChild(script)
callback(data)
}
}

在 Vue.js 中，我們可以在組件的 mounted 鉤子函數中調用 jsonp 函數，并在回調函數中更新組件的數據。例如：

mounted: function() {
var vm = this
jsonp('https://api.example.com/data?callback=handleData', function(data) {
vm.data = data
})
},
methods: {
handleData: function(data) {
this.data = data
}
}

以上代碼中，mounted 鉤子函數在組件加載完成后調用 jsonp 函數獲取數據，callback 參數指定回調函數名為 handleData。當服務端返回 JSON 數據時，handleData 函數會將數據更新到組件的 data 屬性中，從而完成數據綁定。