-
禁用非prop属性继承
2025/10/15 点击：6485
有时候，我们不希望子组件继承非prop属性，Vue3提供了inheritAttrs选项来禁用这种继承。 template div这是子组件/div/templatescript setupimport { useAttrs } from 'vue'const attrs = useAttrs()// 设置inheritAttr
-
Vue3中子组件向父组件传递数据 - 事件触发传递
2025/10/15 点击：2282
在Vue3里，子组件向父组件传递数据常用事件触发的方式。子组件通过$emit触发自定义事件，父组件监听该事件接收数据。 // 子组件代码 发送数据到父组件 要保证父组件正确监听子组件
-
Vue3中子组件向父组件传递数据 - 父组件监听
2025/10/15 点击：2452
父组件要监听子组件触发的事件，才能接收子组件传递的数据。通过在子组件标签上绑定事件处理函数。 // 父组件代码 接收到子组件的数据: {{ receivedData }} 父组件的事件处理函数参数
-
Vue3中监听子组件事件 - 基本概念
2025/10/15 点击：8432
在Vue3里，监听子组件事件是常见操作。子组件可通过$emit触发自定义事件，父组件监听这些事件并响应。 !-- 子组件 --template button @click="sendEvent"触发事件/button/templatescript setupimport { de
-
Vue3中监听子组件事件 - 父组件监听
2025/10/15 点击：2185
父组件监听子组件事件，需在子组件标签上使用v-on指令。 !-- 父组件 --template ChildComponent @customEvent="handleEvent" //templatescript setupimport ChildComponent from './ChildComponent.vue';const handleEvent = () =
-
Vue3中将原生事件绑定到组件 - 基本绑定方式
2025/10/15 点击：6308
在Vue3里，把原生事件绑定到组件可借助 $attrs 来实现。当组件未明确接收某些属性时，这些属性会被包含在 $attrs 中。 template button v-bind="$attrs"按钮/button/templatescript setup// 这里可以添加
-
Vue3中将原生事件绑定到组件 - 单个事件绑定
2025/10/15 点击：2201
除了使用 $attrs 整体绑定，也能单独绑定某个原生事件。比如要绑定 click 事件。 template button @click="handleClick"按钮/button/templatescript setupimport { defineProps } from 'vue';const props = defineProps({});
-
Vue3中sync修饰符的基本概念
2025/10/15 点击：6271
在Vue3里，sync修饰符可简化父子组件间双向数据绑定。以前，父子组件通信要自定义事件。比如父组件向子组件传值用props，子组件改值要发自定义事件给父组件。有了sync修饰符，这过
-
Vue3中sync修饰符的子组件实现
2025/10/15 点击：6058
子组件用sync修饰符时，要在接收prop后，通过触发自定义事件更新父组件数据。下面是子组件代码示例。 !-- 子组件 --template button @click="updateTitle"修改标题/button/templatescript setupimport { d
-
Vue3中插槽的基本概念
2025/10/15 点击：2304
在Vue3里，插槽是组件中重要的功能，用于实现组件内容的分发。简单来说，插槽能让组件接收外部传入的内容。 !-- 定义一个简单组件 --template div slot/slot !-- 插槽位置 -- /div/templatescri
