vue3使用watch

最新推荐文章于 2024-08-15 01:13:27 发布

smily_word

最新推荐文章于 2024-08-15 01:13:27 发布

阅读量814

点赞数

分类专栏： vue3 文章标签： vue

本文链接：https://blog.csdn.net/smily_word/article/details/121680335

版权

vue3 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

vue3中使用watch代码如下

<template>
    <div>
        {{isShow}}
    </div>
</template>

<script>
import { reactive, onMounted, toRefs, watch} from 'vue'
export default {
    name:'files',
    props: {
        isShow:Boolean
    },
    setup(props, { emit }){
        
        const state = reactive({
            isShow: false
        })
        
        watch(
            //监听是否可展示
            () => props.isShow,
            (newVal, oldVal) => {
                console.log('改变的值',newVal)
                state.isShow = newVal
            }
        )
        onMounted(()=>{
        })
        return{
            ...toRefs(state)
        }
    }
}
</script>

<style scoped>
</style>