首页 > 其他 > 详细

vue3.0之watchEffect,watch用法

时间:2021-04-09 13:27:27      阅读:84      评论:0      收藏:0      [点我收藏+]
<template>
  <div>{{propContent}}</div>
</template>

<script>
import { watchEffect, watch, ref } from "vue";
export default {
  name: "",
  components: {},
  mixins: [],
  props: {
    listArr: {
      type: Object
    },
    list1: {
      type: String
    }
  },
  setup(props, content) {
    let propContent = ref(0);
    watch(
      () => props.list1,
      (val, oldval) => {
        /* ... */
        propContent.value = parseInt(val) + 2;
        console.log("val", val);
        console.log("oldval", oldval);
        console.log("propContent", propContent);
      },
      {
        immediate: true,
        deep: true
      }
    );
    // watchEffect(() => {
    //   console.log("watchEffect", props);
    //   propContent.value = parseInt(props.list1) + 2;
    //   console.log("propContent", propContent);
    // });
    return {
      propContent
    };
  }
};
</script>
<style lang="less" scoped>
</style>

从父组件传了input框的(可以动态改)

list1,然后子组件里面监听

vue3.0之watchEffect,watch用法

原文:https://www.cnblogs.com/lsc-boke/p/14635979.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!