首先說一下vue組件
什么是組件？
在我的理解，vue的所有頁面內容都是組件。
什么是父子組件？
因為所有的頁面內容都是組件，那么怎么區分父子組件呢？其實很簡單，現在有一個頁面，在js里面的 components 創建的組件都是子組件，當然包括外部引入的組件都是叫做子組件。
在當前頁面寫的組件叫做父組件。
什么是插槽？
插槽是用來分發任務（或者說是分發內容的），可以理解為它是用來在子組件里面占位的，然后通過父組件來給插槽設置內容來進行顯示。顯示的位置就是子組件插槽的位置。（如果還不理解沒有關系，接下來會有實例來說明）
當簡單的了解這幾個內容之后就可以開始實際操作了。
組件分兩種：
一種是內部組件，還有一種是外部組件。
內部組件是只能用於當前頁面，具有局限性，不能進行全局復用。
外部組件更加靈活，並且具有全局性，可以全局復用。
下面我們先來看一下內部組件的創建和使用：
效果：
接下來是外部組件的創建和使用：先來個簡單的：先創建一個公共文件夾，用來放組件，然后創建一個組件（即一個vue文件 ）
創建好組件之后在需要使用的頁面去引入組件並且注冊組件：
使用組件：
效果圖：
接下來寫一個效果組件：
引入和注冊組件： 組件標簽的名字還可以像這樣寫，直接拿導入的組件名作為標簽，效果是一樣的
接下來是使用：
· 效果圖：
鼠標懸浮到這個組件上去效果：和預期是一樣的，說明組件的樣式等是可以生效的。
接下來是帶插槽的組件，在上面說過插槽其實就是相當於用來在子組件中占空間給父組件來設置內容的
那看一下它到底是怎么樣的。
步驟和上面的外部組件是差不多的。
先創建子組件：
引入和組成子組件
使用帶插槽的子組件：
效果圖：
哎，好像沒有區別啊，當然啦，因為我還沒有給插槽設置內容嘛，那應該怎么設置呢？其實很簡單，在這個子組件的標簽里面設置的內容就是插槽會顯示的內容
這樣在看效果有什么不同：
效果不明顯？沒事，再來幾個效果進行對比
在子組件里面的插槽添加一個內容，這樣再看效果
子組件的div里面的內容是在slot后面顯示的，那就證實了slot 就是用來占位的了。當然它的作用可不僅僅是用來占位置，它的主要作用是用來分發任務（或者說是分發內容）
再看例：
效果圖：
上面的是匿名插槽，如果我想指定內容到一個指定的插槽位置里面那應該怎么辦呢？
為了解決這個問題，就有了具名插槽，具名插槽就是有名字的插槽的意思，有名字的話要指定內容就容易了。
看實例：創建一個具名插槽 在name屬性的值就是插槽的名字
使用：注意，具名插槽使用的時候一定要把插槽名字寫在最外面的標簽，要保證插槽和子組件的 ying 標簽保持父子關系，否則會被當成是匿名插槽來顯示
效果：
上面兩個插槽都不能進行數據傳遞，那么就有了區域插槽來解決這個問題
區域插槽（作用域插槽）：因為區域插槽可以用來處理父組件傳遞的數據，那么我們首先要做的是創建父級組件的數據
在父組件的data里面創建一個數組數據，（模仿后端傳遞的數據）
接下來我們要將這個數據傳遞給子組件
接下來我們再來設置子組件的區域插槽：
接下來看效果：
這樣就能通過插槽來對父級組件的數據進行傳遞處理了。
好了，到這里相信你也會使用了。歡迎留言您的見解和指出錯誤，謝謝！