reactive() 函数接收一个普通对象，返回一个响应式的数据对象, 想要使用创建的响应式数据也很简单，创建出来之后，在setup中return出去，直接在template中调用即可

    1. <template>
    2.   <div>
    3.     <div class="home">
    4.       姓名:{{ msg }} 年龄:{{ age }}
    5.       <button @click="add">点我年龄加1</button>
    6.     </div>
    7.   </div>
    8. </template>
    10. <script lang="ts">
    11. import { reactive,toRefs } from "vue";
    13. export default {
    14.   name: "HelloWorld",
    15.   setup() {
    16.     const msg = "王苏";
    17.     //设置动态数据，相当于vue.0中在data中存放数据
    18.     let state = reactive({
    19.       age: 18,
    20.     });
    21.     function add():void {
    22.       state.age += 1;
    23.     }
    24.     //返回的数据会是响应式数据
    25.     return { msg,...toRefs(state),add };
    26.   },
    27. };
    28. </script>