PHP前端开发

vue组件传值怎么实现

百变鹏仔 3周前 (09-25) #VUE
文章标签 组件
vue 组件传值有两种主要方法:使用 props 传递明确定义的数据,或者使用插槽传递动态或复杂的内容。props 严格类型检查和代码可重用,而插槽更灵活。

Vue 组件传值方法

Vue 中组件传值有两种主要方法:

1. Props

(a) 父组件传递 Props 给子组件

立即学习“前端免费学习笔记(深入)”;

<template><child :message="someData"></child></template>

(b) 子组件接收 Props

export default {  props: ['message'] // 接收名为 'message' 的道具}

2. 插槽

(a) 父组件向插槽传递内容

<template><child><span>我是传递给槽的内容</span>  </child></template>

(b) 子组件接收插槽内容

<template><div>    <slot name="default"></slot></div></template>

比较