diff --git a/学习VUE/hello_vue3/src/pages/09_slot_作用域插槽/Father.vue b/学习VUE/hello_vue3/src/pages/09_slot_作用域插槽/Father.vue index 45df70f..b3df11a 100644 --- a/学习VUE/hello_vue3/src/pages/09_slot_作用域插槽/Father.vue +++ b/学习VUE/hello_vue3/src/pages/09_slot_作用域插槽/Father.vue @@ -33,20 +33,22 @@ \ No newline at end of file diff --git a/学习VUE/hello_vue3/src/pages/09_slot_作用域插槽/Game.vue b/学习VUE/hello_vue3/src/pages/09_slot_作用域插槽/Game.vue index f33cc43..a6bd7e9 100644 --- a/学习VUE/hello_vue3/src/pages/09_slot_作用域插槽/Game.vue +++ b/学习VUE/hello_vue3/src/pages/09_slot_作用域插槽/Game.vue @@ -6,27 +6,29 @@ \ No newline at end of file diff --git a/学习VUE/hello_vue3/src/pages/09_slot_默认插槽/Father.vue b/学习VUE/hello_vue3/src/pages/09_slot_默认插槽/Father.vue index dda1b56..1303f34 100644 --- a/学习VUE/hello_vue3/src/pages/09_slot_默认插槽/Father.vue +++ b/学习VUE/hello_vue3/src/pages/09_slot_默认插槽/Father.vue @@ -3,6 +3,7 @@

父组件

+ diff --git a/学习VUE/hello_vue3/src/utils/emitter.ts b/学习VUE/hello_vue3/src/utils/emitter.ts new file mode 100644 index 0000000..8129c84 --- /dev/null +++ b/学习VUE/hello_vue3/src/utils/emitter.ts @@ -0,0 +1,29 @@ +// 引入mitt +import mitt from 'mitt' + +// 调用mitt得到emitter,emitter能:绑定事件、触发事件 +const emitter = mitt() + +/* // 绑定事件 +emitter.on('test1',()=>{ + console.log('test1被调用了') +}) +emitter.on('test2',()=>{ + console.log('test2被调用了') +}) + +// 触发事件 +setInterval(() => { + emitter.emit('test1') + emitter.emit('test2') +}, 1000); + +setTimeout(() => { + // emitter.off('test1') + // emitter.off('test2') + emitter.all.clear() +}, 3000); */ + + +// 暴露emitter +export default emitter \ No newline at end of file diff --git a/学习VUE/hello_vue3/笔记/shallowRef与shallowReactive.vue b/学习VUE/hello_vue3/笔记/shallowRef与shallowReactive.vue new file mode 100644 index 0000000..2e3f6e9 --- /dev/null +++ b/学习VUE/hello_vue3/笔记/shallowRef与shallowReactive.vue @@ -0,0 +1,27 @@ +import { shallowRef } from 'vue'; + +const user = shallowRef({ name: 'Alice', age: 30 }); + +// 修改 user 本身会触发更新 +user.value = { name: 'Bob', age: 25 }; // 响应式触发 + +// 修改 user.value 的属性不会触发更新 +user.value.name = 'Charlie'; // 不会触发响应式更新 + + +import { shallowReactive } from 'vue'; + +const user = shallowReactive({ +name: 'Alice', +age: 30, +address: { +city: 'New York', +zip: '10001' +} +}); + +// 修改一级属性会触发响应式更新 +user.name = 'Bob'; // 响应式触发 + +// 修改嵌套属性不会触发响应式更新 +user.address.city = 'Los Angeles'; // 不会触发响应式更新