vue는 여러 가지 방법이 실행된 후에 다른 방법을 실행합니다. (요청이 끝난 후에 실행될 때까지 기다립니다.) async/await 사용 방법과Promise.all
1577 단어 vue.jsJavaScriptbug
Promise를 사용합니다.이루다Promise는 ES6의 새로운 기능으로 비동기 조작 논리를 처리하는 데 사용되며, Promise에 then과catch 함수를 추가하여 성공과 실패를 처리하는 데 사용되었다.
ES7에서 ASync와 await를 새로 제안하였으며, ASync와 await를 사용하는 것을 권장합니다.
function fun1(){
return new Promise((resolve, reject) => {
/* */
console.log("1");
});
},
function fun2(){
return new Promise((resolve, reject) => {
/* */
console.log("2");
});
},
function fun3(){
return new Promise((resolve, reject) => {
/* */
console.log("3");
});
},
/* */
function run(){
Promise.all([
this.fun1(),
this.fun2(),
this.fun3()
]).then(res => {
/* */
console.log("run");
})
}
async/await 사용 방법
// 1
async function testSync() {
const response = await new Promise(resolve => {
setTimeout(() => {
resolve("async await test...");
}, 1000);
});
console.log(response);
}
testSync();//async await test...
// 2
async getScheduleList(selectDate) {
let response;
// request
await request(api.getScheduleList, {
date: selectDate
}).then(res => {
response = res;
});
return response
}
init() {
this.getScheduleList(selectDate).then(res => {
console.log(res)
})
}
// 3
swichMenu: async function() {
// menu
const num = await getNum()
return num
}
swichMenu().then(res => {
console.log(res)
})
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
[백견불여일타/Vue.js] 4장 - 입력 폼 데이터 가져오기v-model 데이터 입력 select 지난 장에서는 v-bind를 이용해서 HTML 태그 속성 값을 Vue로 다루는 법을 배웠습니다. 이번에는 사용자가 입력한 데이터를 Vue로 가져오는 법에 대해 다룹니다. 웹 페...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.