- toRef:把一个 响应式对象 转换为对应的ref变量
- toRefs:把一个 响应式对象 转换为对应的ref对象
代码
<template><P>mname: {{ mname }} </P><P>mage: {{ mage }} </P><P>msex: {{ msex }} </P><P>mhobby: {{ mhobby }} </P><hr><P>mname1: {{ mname1 }} </P><P>mage1: {{ mage1 }} </P><P>msex1: {{ msex1 }} </P><P>mhobby1: {{ mhobby1 }} </P><hr><P>hobby1: {{ mman }} </P></template><script setup>
import { reactive, ref, toRef, toRefs } from 'vue';let man = reactive({name: 'cxk',age: 25,sex: '男',hobby: ['唱', '跳', 'rap']
});const mname = toRef(man, 'name');
const mage = toRef(man, 'age');
const msex = toRef(man, 'sex');
const mhobby = toRef(man, 'hobby');
//解构
const { name: mname1, age: mage1, sex: msex1, hobby: mhobby1 } = toRefs(man);const mman = toRefs(man);console.log(mname, mage, msex, mhobby);
console.log(mname1, mage1, msex1, mhobby1);
console.log(mman);
</script><style lang="scss" scoped></style>
参考
https://www.bilibili.com/video/BV1nV411Q7RX