From 72a4bec26a87855873e50c328b3e8d6bbdbd726e Mon Sep 17 00:00:00 2001 From: dj Date: Thu, 5 Feb 2026 17:26:17 +0800 Subject: [PATCH] =?UTF-8?q?docs(examples):=20=E6=B7=BB=E5=8A=A0=E5=93=8D?= =?UTF-8?q?=E5=BA=94=E6=80=A7=E7=A4=BA=E4=BE=8B=E5=B9=B6=E6=9B=B4=E6=96=B0?= =?UTF-8?q?reactive=E7=A4=BA=E4=BE=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在reactive.html中添加解构赋值示例，展示如何从响应式对象中提取属性 - 添加console.log调试信息以便更好地理解响应式行为 - 新增ref.html文件，提供另一个响应性相关的示例 - 更新示例代码以更好地演示Vue 3的响应性系统 --- .../vue/examples/reactivity/reactive.html | 7 +++++- packages/vue/examples/reactivity/ref.html | 24 +++++++++++++++++++ 2 files changed, 30 insertions(+), 1 deletion(-) create mode 100644 packages/vue/examples/reactivity/ref.html diff --git a/packages/vue/examples/reactivity/reactive.html b/packages/vue/examples/reactivity/reactive.html index d232889..916c07e 100644 --- a/packages/vue/examples/reactivity/reactive.html +++ b/packages/vue/examples/reactivity/reactive.html @@ -13,11 +13,16 @@ const obj=reactive({ name:'张三' }) + let {name}=obj + console.log('name',name); + effect(()=>{ - document.querySelector('#app').innerText=obj.name + document.querySelector('#app').innerText=name }) setTimeout(()=>{ obj.name='李四' + + console.log('obj',obj); },2000) \ No newline at end of file diff --git a/packages/vue/examples/reactivity/ref.html b/packages/vue/examples/reactivity/ref.html new file mode 100644 index 0000000..628e290 --- /dev/null +++ b/packages/vue/examples/reactivity/ref.html @@ -0,0 +1,24 @@ + + + + + Document + + + +
+ + + \ No newline at end of file