Fri Jun 28 11:28:00 CST 2024 inscode

src/App.vue

 <script setup>
-import {watchEffect,shallowReadonly,readonly,ref,reactive,shallowRef,computed} from 'vue'
-const simpleData = ref('欢迎使用VUE3.0')
-const objData = ref({
-    msg:'VUE3.0是真的好'
-})
-
-const simpleReactiveData = reactive('123')
+import {watchEffect,shallowReadonly,readonly,ref,reactive,shallowRef,computed, isRef, unref} from 'vue'
 
-let obj ={
-    "resultCode": "0",
-    "resultMsg": "success",
-    "data": [
-    {
-            "msg": "结构化list提示信息11111",
-            "type": "stgPrompt"
-        },
-        {
-            "msg": "结构化list提示信息",
-            "type": "listPrompt",
-            "list": [
-                {
-                    "customerCode": "1000002183",
-                    "customerName": "国药控股天津有限公司",
-                    "notReceivedAmount": 2
-                },
-                {
-                    "customerCode": "10000021831",
-                    "customerName": "国药控股天津有限公司1",
-                    "notReceivedAmount":1
-                },
-                {
-                    "customerCode": "10000021831",
-                    "customerName": "国药控股天津有限公司1",
-                    "notReceivedAmount":9
-                }
-            ]
-        }
-    ]
+const obj={
+    name:'普通obj'
 }
 
-let res = obj.data.map(item=>{
-    if(item.type==='listPrompt' && item.list && item.list.length>0){
-        return item.list=item.list.filter(item=>{
-            return item.notReceivedAmount>0
-        })
-    }else{
-        return item
-    }
+const simpleData = ref('欢迎使用VUE3.0')
+const objData = ref({
+    msg:'VUE3.0是真的好',
+    age:18
 })
 
-console.log(11,res)
+const reactiveObj = reactive({
+    name:'李四',
+    age:12
+})
 
-let arr = obj.data.filter(item=>{
-    return item.type === 'listPrompt' && item.list.length>0
+const reactiveObjObj=reactive({
+    obj:{
+        name:'王五',
+        age:21
+    }
 })
 
-console.log(123312,arr)
-// let arr1 = arr.filter(item=>{
-//     return item.notReceivedAmount>0
-// })
-// console.log(arr1)
+function handleClick(){
+    objData.value={
+        name:'王五1',
+        age:211
+    }
+}
+console.log(simpleData)
+console.log(unref(simpleData))
+// console.log(unref(obj))
+// console.log(unref(objData))
 </script>
 
 <template>
+    <button @click="handleClick">++</button>
     <div>
-       <p>{{count}}</p>
-       <button @click="count++">+</button>
+        <p>{{ obj }}</p>
+       <p>{{ simpleData }}</p>
+       <p>{{ objData }}</p>
+       <p>{{ reactiveObj }}</p>
+       <p>{{ reactiveObjObj }}</p>
     </div>
 </template>