個人理解插槽區別

 <template slot-scope="scope"> 在vue項目里面可以用，拿到的當面行后台返回的所有數據

例如：

<el-table-column fixed="right" label="操作" width="120">

　　 <template slot-scope="scope">

　　　　 <div> {{scope.row}} </div>  //可以拿到當前行，所有后台返回的數據

　　</template>

</el-table-column>

 

 

 <div slot="reference"></div>  前端用頁面的一部分替換頁面的另一部分

  例如：

 <td  width=35%>

                <div  v-if="item.ext=='png' || item.ext=='jpg'"> 

                          <el-popover

                           　　 placement="right"

                          　　  width="400"

                           　　 trigger="click">

                           　　 <img :src="item.url"/>  // 替換項

                             　　<div slot="reference">

                              　　  <img  :src="item.url" style="width:100px;height:50px; cursor:pointer" />   // 被替換

                             　　</div>                 

                        </el-popover>

                </div>

                <div  v-else><a :href=item.url download="">{{item.fileName}}</a></div>

 </td>