vue（uniapp)子组件如何监听数据变化（数据变化后执行方法）

适用场景是
父组件

<template>
  <view>
      <cylindrical :haveTask="totals"></cylindrical>
  </view>
</template>

<script>
  import cylindrical from '@/pagesB/componentsB/cylindrical.vue'
  export default {
    components: {
      cylindrical
    },
    data() {
      return {
        totals: [], //数据
      }
    }
  }
</script>

<style lang="scss">
  
</style>

子组件

<template>
  <view >
    <view>
    {{haveTask}}
    </view>
  </view>
</template>

<script>
  // import time from '@/basejs/time';
  export default {
    props: {
      haveTask: Array,
    },
    data() {
      return {
      }
    },
    watch: {
    //haveTask 为接收参数的名称
      haveTask: {
        handler(newValue,oldValue) {
          this.circulation();//监听到数据变化执行方法
        },
        deep: true // 深度监听父组件传过来对象变化
      }
    },
    methods: {
      circulation() {
           console.log('已经监听到数据变化')
      },
    }
  };
</script>

<style>

</style>