亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

Vue3中reactive函數(shù)toRef函數(shù)ref函數(shù)簡(jiǎn)介

 更新時(shí)間:2021年09月23日 16:49:39   作者:SpringSir  
這篇文章主要介紹了Vue3中的三種函數(shù),分別對(duì)reactive函數(shù)toRef函數(shù)以及ref函數(shù)原理及使用作了簡(jiǎn)單介紹,有需要的朋友可以借鑒參考下

reactive函數(shù)

reactive用于定義響應(yīng)式數(shù)據(jù)(可以理解 成data的替代品)

用法:

導(dǎo)入 import {reactive} from ‘vue'

使用:

const state=reactive({
    參數(shù)名:參數(shù)值
})

訪問: state.參數(shù)名

訪問: state.參數(shù)名

toRef函數(shù)(了解即可)

toRef:將響應(yīng)式數(shù)據(jù)中某個(gè)字段提取出來成單獨(dú)響應(yīng)式數(shù)據(jù)

用法:

導(dǎo)入 import {toRef} from ‘vue'

使用:

const state=reactive({
    num:0
})
const num=toRef(state(響應(yīng)式數(shù)據(jù)),'num屬性名')
num:{
    value:0
}
Ref實(shí)際可以理解成一種數(shù)據(jù)類型:{value:值}

訪問:num.value===0

注意點(diǎn):

html:中使用響應(yīng)式數(shù)據(jù)時(shí)可以不用寫value

js中一定要寫value

ref函數(shù)

定義響應(yīng)式數(shù)據(jù)

{
    value:值
}

直接定義使用

導(dǎo)入
import {ref} from 'vue'
setup(){
定義
    const num=ref({a:1,b:2})  
    num:{
       value:{a:1,b:2}
    }
}

訪問: num.value===0

reactive:適用于多個(gè)數(shù)據(jù),ref適用于單個(gè)數(shù)據(jù)

獲取dom

<template>
  <div ref="target">123</div>
</template>
scripte
import {ref} from 'vue'
setup(){
   const target=ref(null)   
   return {target} 
   target.value就是相應(yīng)dom   
}

獲取組件實(shí)例對(duì)象

ref用于原生標(biāo)簽就是獲取dom

ref用于組件標(biāo)簽就是獲取組件實(shí)例對(duì)象

用法和獲取dom一樣的

<template>
  <組件標(biāo)簽 ref="target">123</組件標(biāo)簽>
</template>
script
import {ref} from 'vue'
setup(){
   const target=ref(null)   
   return {target} 
   target.value就是組件實(shí)例對(duì)象
}

以上就是Vue3中reactive函數(shù)toRef函數(shù)ref函數(shù)簡(jiǎn)介的詳細(xì)內(nèi)容,更多關(guān)于Vue3函數(shù)的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章!

相關(guān)文章

最新評(píng)論