Vue3--篇6--ref函数--处理基本数据类型
<template>
<h1>姓名：{{ name }}</h1>
<h1>岁数：{{ age }}</h1>
<h1><button @click="editInfo">修改信息</button></h1>
</template>
<script>
import { ref } from "vue";
export default {
name: "App",
setup() {
let name = ref("张三");
let age = ref("14");
console.log(name); //通过ref函数处理，返回的是一个引用对象
function editInfo() {
//修改用如下方式，才能实现响应式
name.value = "李四";
age.value = "18";
}
return {
name,
age,
editInfo,
};
},
};
</script>
<style lang="scss"></style>
image.png
image.png
本文标题：Vue3--篇6--ref函数--处理基本数据类型
本文链接：https://www.haomeiwen.com/subject/gxccddtx.html
网友评论