在使用vue進(jìn)行ajax請(qǐng)求時(shí),我們一般都會(huì)在created鉤子函數(shù)中發(fā)起請(qǐng)求。下面是一個(gè)簡單的例子,在created中發(fā)起get請(qǐng)求:
created() { axios.get('/api/data') .then(response =>{ this.data = response.data }) }
可以看到,在created中使用了axios庫發(fā)起了一個(gè)get請(qǐng)求,并將返回?cái)?shù)據(jù)賦值給了Vue實(shí)例中的data屬性。
當(dāng)然,我們也可以在created中發(fā)起post請(qǐng)求。下面是一個(gè)例子:
created() { axios.post('/api/data', { param1: 'value1', param2: 'value2' }) .then(response =>{ this.data = response.data }) }
可以看到,在post請(qǐng)求中需要傳遞參數(shù),我們將參數(shù)寫在對(duì)象中傳入axios.post函數(shù)中即可。
除此之外,我們還可以在created之外的函數(shù)中發(fā)起ajax請(qǐng)求。下面是一個(gè)例子:
methods: { fetchData() { axios.get('/api/data') .then(response =>{ this.data = response.data }) } }, created() { this.fetchData() }
可以看到,在created中調(diào)用fetchData方法,在該方法中使用axios發(fā)起get請(qǐng)求,最終將返回值賦值給Vue實(shí)例的data屬性。
使用Vue進(jìn)行ajax請(qǐng)求非常方便,只需要在created或其他合適的函數(shù)中使用axios庫發(fā)起請(qǐng)求即可。需要注意的是,在get和post請(qǐng)求中需要傳遞的參數(shù)不同,需要根據(jù)需求進(jìn)行相應(yīng)的編寫。