ref函数
- 作用:定义一个响应式的数据,或者说是生成一个引用实现对象
- 语法:
const xxx = ref(initValue)
- 创建一个包含响应式数据的引用对象(reference对象)
- JS中操作数据需要:xxx.value
- 模板中读取数据:直接使用即可
PS:
- ref接收的数据可以是基本类型数据,也可以是对象类型
- 基本类型的数据:响应式是靠Object。defineProperty()的get和set完成的
- 对象类型的数据:内部使用了reactive函数
<template>
<h1>{
{name}}</h1>
<h1>{
{age}}</h1>
<button @click="sayHi"></button>
</template>
<script>
import {ref} from 'vue'
exprot default {
name: 'App',
setup() {
const name = ref("景天")
const age = ref(18)
const job = ref({
type: '前端',
money:'30K'
}) // 其实Vue3帮你调用了reactive函数