Vue3.0 watchEffect

最新推荐文章于 2024-09-15 16:33:50 发布

weixin_45842460

最新推荐文章于 2024-09-15 16:33:50 发布

阅读量144

点赞数

分类专栏： Vue3.0从入门到放弃文章标签： vue.js javascript html

本文链接：https://blog.csdn.net/weixin_45842460/article/details/120244715

版权

Vue3.0从入门到放弃专栏收录该内容

16 篇文章 1 订阅

订阅专栏

在这里插入图片描述

<template>
  <div>
    <h3>name：{{ person.name }}</h3>
    <h3>age：{{ person.age }}</h3>
    <button @click="add2">涨年龄</button>
  </div>
</template>
<script>
import { reactive, watchEffect } from "vue";
export default {
  setup() {
    let person = reactive({
      name: "李四",
      age: 16,
    });

    function add2() {
      person.age++;
    }
    //监听所有定义的响应式数据,
    watchEffect(() => {
      console.log(person.age);
    });
    return {
      person,
      add2,
    };
  },
};
</script>