vue 动态插槽与插槽循环的用法

1. 普通插槽

// 子组件:AppForm
...

  

...



// 引用子组件
...

  

...

注： name 属性的值为插槽名， prop 为插槽传递的参数之一（ prop 可以是随便定义的名字），获取插槽的传参时可以用解构的写法直接使用prop 的值。

2. 动态插槽

适用场景为：组件的插槽名无法固定的情况，如插槽很多且内容不固定时

// 子组件APPForm
...

  

...



// 引用子组件
...

  
  

...

3. 插槽循环

适用场景为：组件内有多个内容相同的插槽

// 子组件APPForm
...

  

...



// 引用子组件
...

  
  

...