javascript / beginner
Snippet
Basic Data Reactivity with ref
In the Composition API, ref() is used to make a variable reactive. To change or read the value inside the script, you must use the .value property.
snippet.js
1
2
3
4
5
6
7
8
9
<script setup>import { ref } from 'vue';const username = ref('Alex');const updateName = () => {username.value = 'Sam';};</script>
vue
Breakdown
1
ref('Alex')
Initializes a reactive state with the string 'Alex'.
2
username.value = 'Sam'
Updates the underlying value, which triggers UI updates automatically.