vue3中的reactive

reactive与ref的区别：1.reactive不能定义基本数据类型，只能数组，对象 2.ref需要.value而reactive不需要

<template>

    <div>

         <h1>姓名：{{obj.name}}</h1>

         <h1>年龄：{{obj.age}}</h1>

         <h1>产品：{{obj.taobao}}</h1>

         <h1>深层次数据响应：{{obj.pro.a.b[0]}}</h1>

         <button @click="btn">点击更新视图层某一个数据</button>

    </div>

   </template>

<script>

import {reactive} from 'vue'

export default ({

  setup(){

   

    const name='马云'

    const age =50

    const taobao='淘宝'

    const obj=reactive({

        taobao,

        name,

        age,

        pro:{

            a:{

                b:['我是深层次数据']

            }

        }

        })

    //点击按钮后改变，先定义ref，再.value

    function btn()

    {

        obj.name='麻花疼'

        obj.pro.a.b[0]='我被改变了'

    }

    return {btn,obj}

  },

  })

</script>