By webfansplz @webfansplz
在这个挑战中,你将使用 响应式 API: effectScope
来完成它。
以下是你要实现的内容 👇:
<script setup lang="ts">
import { ref, computed, watch, watchEffect } from "vue"
const counter = ref(1)
const doubled = computed(() => counter.value * 2)
// 使用 `effectScope` API 使这些Effect效果在触发一次后停止
watch(doubled, () => console.log(doubled.value))
watchEffect(() => console.log("Count: ", doubled.value))
counter.value = 2
setTimeout(() => {
counter.value = 4
})
</script>
<template>
<div>
<p>
{{ doubled }}
</p>
</div>
</template>