ref的用法

原创于 2022-12-24 12:14:16 发布 · 197 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #javascript #前端

vue 专栏收录该内容

722 篇文章

订阅专栏

本文展示了在 Vue.js 模板中如何使用 ref 来绑定基本数据类型，并通过点击事件更新数据。示例包含了一个计数器，每次点击按钮时 count 值递增。`count.value` 在不同位置的 console.log 输出揭示了其值的变化过程。

<template>
  <div>
    <div><span>count is {{ count }}</span></div>
    <div><button @click="instrement">instrement</button></div>
 
  </div>
</template>

<script setup>
import { ref } from 'vue'

const count = ref(0)
console.log(count.value) // 0

//count.value++
//console.log(count.value) // 1

const instrement = () => { count.value++ }
console.log(count.value++)
</script>

基本数据类型，ref用于