...toRefs（data）

toRefs 是 Vue 3 中的一个函数，它接收一个响应式对象，并返回该对象属性的浅层响应式代理。这意味着返回的对象中的每个属性都是一个 ref 对象，可以在模板中以响应式方式使用。

这样做的好处是，当原始响应式对象的属性发生变化时，通过 toRefs 转换后的对象中相应属性的值也会自动更新。

<template>
  <div>
    <!--搜索-->
    <div style="float: left">
      <el-input v-model="username" style="width: 350px" placeholder="请输入搜索的用户姓名" />
</div>
</template>

<script>
import {reactive, toRefs} from "vue";
export default {
  setup(){
    const data=reactive({
      username:''
    })
  
    return{
      ...toRefs(data)
    }
  }
}
</script>

使用...toRefs可以一次性返回data的所有属性,这样在使用data中的属性是可以不用使用data.username去使用了！