如何解决如何在VUEJS脚本中应用settimeout?
我正在vuejs中开发我的第一个应用程序,并且在脚本的初始数据上传中,我需要修改从数据库调用中收到的数据。 由于我已经修改了数据,因此它在页面的初始加载中返回了错误,几秒钟后它加载就没有问题。 我试图将此函数包装在settimeout中,但它在vuejs中返回错误。 如何应用此setTimeout?
这是我的脚本
<script>
export default {
data () {
return {
step: 1,selected: 1
}
},components: {
},computed:{
selectedBasket() {
return !this.$store.getters.basket ? null : this.$store.getters.basket
},items(){
return !this.$store.getters.items ? null : this.$store.getters.items
},setTimeout(() => {
filteredEstimation(){
this.$store.getters.estimations.map(function(estimation) {
estimation.offers.map(function(offer) {
offer.name = offer.name.split(" ").reverse().slice(1).reverse().join(" ");
if (offer.name.includes("first")) {
offer.description = "first option";
}
if (offer.name.includes("second")) {
offer.description = "second option";
}
if (offer.name.includes("third")) {
offer.description = "third option";
}
});
});
return !this.$store.getters.estimations ? null : this.$store.getters.estimations.filter( item => item.id == this.selected )[0].offers
},700);
},methods: {
getItemsName(item) {
if(item == 1){
return 'bag'
} else if(item == 2){
return 'paper'
} else {
return 'pen'
}
}
}
}
</script>
解决方法
您要在计算选项中使用该函数,这是不允许的,您应该在挂接的钩子中定义它,如:
<script>
export default {
data () {
return {
step: 1,selected: 1
}
},components: {
},computed:{
selectedBasket() {
return !this.$store.getters.basket ? null : this.$store.getters.basket
},items(){
return !this.$store.getters.items ? null : this.$store.getters.items
},},methods: {
getItemsName(item) {
if(item == 1){
return 'bag'
} else if(item == 2){
return 'paper'
} else {
return 'pen'
}
}
},mounted(){
setTimeout(() => {
filteredEstimation(){
this.$store.getters.estimations.map(function(estimation) {
estimation.offers.map(function(offer) {
offer.name = offer.name.split(" ").reverse().slice(1).reverse().join(" ");
if (offer.name.includes("first")) {
offer.description = "first option";
}
if (offer.name.includes("second")) {
offer.description = "second option";
}
if (offer.name.includes("third")) {
offer.description = "third option";
}
});
});
return !this.$store.getters.estimations ? null : this.$store.getters.estimations.filter( item => item.id == this.selected )[0].offers
},700);
}
}
</script>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。