QQ_1440277049
QQ_1440277049

Vue中slot 插槽（新旧版本）

slot 插槽

  1. 作用/概念: 预先将将来要使用的内容进行保留
  2. 具名插槽： 给slot起个名字

slot 作用域插槽

  1. 旧： slot-scope

    • 使用流程
      • 在组件的模板中书写slot插槽，并将当前组件的数据通过 v-bind 绑定在 slot标签上
      • 在组件使用时，通过slot-scope = “slotProp” 来接收slot标签身上绑定的数据
      • 通过 slotProp.xxx 就可以进行使用了
          
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
      <title>Documenttitle>
    head>
    <body>
      <div id="app">
        <Hello>