【金秋打卡】第24天 6-6 如何理解ref toRef 和 toRefs
標簽:
JavaScript
课程名称:前端框架及项目面试 聚焦Vue3/React/Webpack
课程讲师: 双越
课程内容:
如何理解ref toRef 和 toRefs
课程收获:
toRefs将响应式对象变成普通对象后,每一个属性都具有响应式ref,此时需要使用 .value才能获取其值
<template>
<p>ref demo {{ageRef}} {{state.name}}</p>
</template>
<script>
import { ref, reactive } from 'vue'
export default {
name: 'Ref',
setup() {
const ageRef = ref(20) // 值类型 响应式
const nameRef = ref('双越')
const state = reactive({
name: nameRef
})
setTimeout(() => {
console.log('ageRef', ageRef.value)
ageRef.value = 25 // .value 修改值
nameRef.value = '双越A'
}, 1500);
return {
ageRef,
state
}
}
}
</script>
谢谢老师,讲的非常细致,很容易懂。这一节学的是如何理解ref toRef 和 toRefs,给以后的学习打下了基础。
原来vue3能有这么多种性质,以及对vue有了新的认识,期待后边的学习
點擊查看更多內(nèi)容
為 TA 點贊
評論
評論
共同學習,寫下你的評論
評論加載中...
作者其他優(yōu)質(zhì)文章
正在加載中
感謝您的支持,我會繼續(xù)努力的~
掃碼打賞,你說多少就多少
贊賞金額會直接到老師賬戶
支付方式
打開微信掃一掃,即可進行掃碼打賞哦