ref()の働き
date
Feb 27, 2023
repo_url
slug
about-ref
status
Published
summary
type
Post
thumbnail_url
tags
vue
outer_link
Vue3で出てくる
ref()についてのまとめ。そもそもVueではリアクティブシステムというものがあり、これは値の変化に応じて表示内容が自動で変わる、というシステムになっている。
以下はref()を使った場合と使わなかった場合の動作例。
なおリアクティブ変数を置き換える場合は、ref()によって生成された変数のvalueプロパティの値を変更する。
const hoge = ref(fuga);
hoge.value = 'piyo';ref()の返り値について
ref() の返り値はRef<T> のプリミティブなデータとなる。Tsを導入している場合は型は自動的につけられる。
const numberValue = ref(0); //型はRef<number>
const stringValue = ref('何もない'); //型はRef<string>