微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

如何在VUEJS脚本中应用settimeout?

如何解决如何在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 举报,一经查实,本站将立刻删除。