关于Vue中,在方法中使用(操作)子组件获取到的数据

已知,子组件通过props获取父组件传过来的数据,而这个数据是无法在created、mounted生命周期中使用的,只能在beforeUpdated或者updated获取到

但是如果我们要使用这个数据再获取其他数据并渲染到页面,我们就不能在beforeUpdated或者updated操作,自相矛盾。

这就可以用到Vue的watch方法,先监听子组件获取到的数据,当数据有变化后(也就是数据获取到后),再调用相应的方法。

如下,子组件获取到数据detail,然后要在getTicket方法中使用这个数据,就要在watch中先监听detail的变化,当detail有数据后,再调用getTicket方法,在方法中对数据进行使用

props: {
    detail: ''
  },
  methods: {
    async getTicket () {
      console(this.detail)
    }
  },
  watch: {
    detail () {
      this.getTicket()
    }
  }

 

posted @ 2019-09-12 14:57  jANE2160  阅读(3871)  评论(0编辑  收藏  举报