vue3中的defineProps,watch,computed

在vue3的setup语法糖中,defineProps不需要引入了

<script setup>
import { computed } from '@vue/reactivity';
import { onMounted, watch } from 'vue';

let props = defineProps(['playlist'])
console.log(props.playlist) // 不能获取值,因为父组件这时候还没传值过来
// onMounted(() => {
//     setTimeout(() => {
//         console.log('23:', props.playlist); // ok
//     }, 800)
// })
let bmsg = watch(() => props.playlist, (a, pre) => { // watch函数监听props.playlist的值
    console.log("2345:", a);
    console.log("2345pre:", pre);
},{immediate:true}) // immediate:true,让watch立即执行回调打印值
let msg = computed(() => { // 立即执行
    console.log('23:', props.playlist);

    return props.playlist
})
posted @ 2022-10-17 18:34  方寸间  阅读(2254)  评论(0编辑  收藏  举报