Vue3异步加载中使用 watch
导读:异步加载中使用 watch 异步数据的加载 Vue 通过 watch 选项提供了一个更通用的方法,来响应数据的变化。 以下实例我们使用 axios 库,后面会具体介绍。 实例 const watchExampleV...
异步加载中使用 watch
异步数据的加载 Vue 通过 watch 选项提供了一个更通用的方法,来响应数据的变化。
以下实例我们使用 axios 库,后面会具体介绍。
实例
const watchExampleVM = Vue.createApp({
data() {
return {
question: '',
answer: '每个问题结尾需要输入 ? 号。'
}
}
,
watch: {
// 每当问题改变时,此功能将运行,以 ? 号结尾
question(newQuestion, oldQuestion) {
if (newQuestion.indexOf('?') >
-1) {
this.getAnswer()
}
}
}
,
methods: {
getAnswer() {
this.answer = '加载中...'
axios
.get('https://yesno.wtf/api')
.then(response =>
{
this.answer = response.data.answer
}
)
.catch(error =>
{
this.answer = '错误! 无法访问 API。 ' + error
}
)
}
}
}
).mount('#watch-example')
声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!
若转载请注明出处: Vue3异步加载中使用 watch
本文地址: https://pptw.com/jishu/655610.html