vue3中onMounted初始化数据异步加载的最好方式
3.还可以使用`promise.all([method1, mothod2, mothod3]).then(res => {}).catch(e => {})`2.里面的封装的其他方法本身如果有接口调用,本身也需要异步;1.onMounted内需要async异步;
·
vue3初始化数据异步加载的最好方式
```javascript
<script setup lang="ts">
import { onMounted } from "vue";
.....
.....
.....
async function fetchLiveSetting() {
const { data, code } = await getLiveSetting('Agora')
if(code === 200) {
agoraPara.appid = data.app_id
agoraPara.token = data.token
agoraPara.channel = data.channel
```javascript
}
}
const getAircrafts = async () => {
await getExeDrones({ workspace_id: workspaceId }).then(res => {
aircrafts.value = res.data
form.dock_sn = res.data[0].dock_sn
console.log('sn', form.dock_sn);
}).catch(err => { console.log(err) })
}
const getWayLineList = async () => {
await getLineData({ workspace_id: workspaceId }).then(res => {
lineList.value = res.data;
}).catch(err => { console.log(err) })
}
onMounted(async () => {
await fetchLiveSetting()
await getAircrafts()
await getWayLineList()
if (form.dock_sn) {
// 业务代码
}
``` 总结: 1.onMounted内需要async异步; 2.里面的封装的其他方法本身如果有接口调用,本身也需要异步; 3.还可以使用`promise.all([method1, mothod2, mothod3]).then(res => {}).catch(e => {})`更多推荐
已为社区贡献1条内容
所有评论(0)