【vue3】setup使用watch,ref

本文已参与「新人创作礼」活动，一起开启掘金创作之路。

一个setup()只注重一段业务逻辑

<template>
	<div>{{name}}</div>
	<button @click="setName">设置名字</button>
</template>
import {ref,watch} from 'vue'
export default {
	name: "index",
	setup(){
		//创建一个响应式且可变的 ref 对象
		let name = ref('')
		// 监听变化
        watch(() => name.value,(val) => {
            console.log("name发生了变化",val)
        })
        function setName () {
            name.value = "我是张三"
        }
        return { name, setName  }
	}
}