toRefs的使用
vue的setup有两种写法
写法一:
<script>
export default ({
setup() {
const name = 'vue'
return{
name
}
},
})
</script>
写法二:
不用return
<script setup>
const name = 'vue'
</script>
写法一可将复杂响应式数据直接return出去
<script>
import { reactive, toRefs } from 'vue'
export default ({
setup() {
const person = reactive({
name:'jack',
age:17,
salary:'20K'
})
return{
...toRefs(person)
}
},
})
</script>
//即可直接使用name,age,salary,不用person.name
写法二则是要解构出新的变量
<script setup>
import { reactive, toRefs } from 'vue'
const person = reactive({
name:'jack',
age:17,
salary:&#