如何在 VUEJS 脚本中应用 settimeout？

Question

我正在用 vuejs 开发我的第一个应用程序，在脚本中的初始数据上传中，我需要修改从数据库调用中收到的数据。由于我已经修改了数据，它 returns 在页面的初始加载中出错，几秒钟后它加载没有问题。我试图将此函数包装在 settimeout 中，但它 returns 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>

Answer 1

您在计算选项中使用该函数，这是不允许的，您应该在挂载的钩子中定义它，如：


<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>

如何在 VUEJS 脚本中应用 settimeout？

How to apply a settimeout in the VUEJS script?

javascript

settimeout

vue.js

vue-component

vuejs2