在vue3中和vue2中數據會有所不一樣，不一樣的地方在於數據的寫法和變化
在vue3中數據的變化是需要用到reactive的
在父級中引入
inport{ toRefs, reactive} from "vue
數據：
set(){
const data=reactive({
resource:[
{
_id:"1",
title:"新聞1",
description:"新聞新聞",
type:"video",
link:""
},
{
_id:"2",
title:"新聞2",
description:"新聞新聞",
type:"video2",
link:""
},
{
_id:"3",
title:"新聞3",
description:"新聞新聞",
type:"video3",
link:""
},
{
_id:"4",
title:"新聞4",
description:"新聞新聞4",
type:"video",
link:""
},
{
_id:"5",
title:"新聞5",
description:"新聞新聞5",
type:"video",
link:""
},
{
_id:"6",
title:"新聞6",
description:"新聞新聞6",
type:"video",
link:""
},
{
_id:"7",
title:"新聞7",
description:"新聞新聞7",
type:"video",
link:""
}
]
})
return{ .../toRefs(data)}
}
聲明：
1.數據是需要用到reactive的 完整的寫法就是 import {reactive} from 'vue'
2.數據解包：是需要用到toRefs 完整的寫法就是 import{ toRefs} from "vue"
3. .../toRefs(data)是解包數據的 因為上述的寫法在沒有使用解包.../toRefs(data)的時候。調用數據是寫成2data.resource,當解包之后可以直接獲取數據resource