有時候我們的vue元件需要複製使用者傳遞的內容。
比如我們工程裡面的輪播元件需要使用複製的slot來達到迴圈滾動的效果
使用者關注輪播內容的靜態效果,元件負責讓其滾動起來
元件:
使用者:
123
這種實現方式對於初始化的資料是沒問題的,但是不支援slot內容的動態繫結,這是因為
因此當元件使用者在宣告節點時,因為只宣告了乙個div,後台只生成了1個vnode,最終雖然產生了2個div,但是vnode只和後面1個dom繫結了,當vnode修改時也只會修改1個dom
解法:slot-scope
使用slot-scope資料產生的每個slot都會產生乙個新的vnode
元件:
使用者:
這種情況下component內容有改動,那麼元件內容2個slot都會同步更新
專案使用的vue版本是2.4.2,更高階的vue的slot-scope語法可能不太一樣
更多專業前端知識,請上
【猿2048】www.mk2048.com
vue中的slot scope的使用
說之前 先說下什麼是內容分發 slot內容分發 父元件的內容和子元件的模板混在一起使用 就叫做內容分發 經常碰見的就是 vue.component child 最後頁面只會顯示乙個hello world 正常裡面的hello vue.js是不會被渲染出發的 如果想讓渲染出來的話 就得使用內容分發 s...
Vue 框架與庫的區別 MVVM 簡單使用vue
庫 本質上是一些函式的集合。每次呼叫函式,實現一定的特定的功能,接著把控制權交給使用者 代表 jquery jquery庫核心 dom操作,即 封裝dom操作,簡化dom操作 框架 是一套完整的解決方案,使用框架的時候,需要把你的 放到框架適合的地方,框架會在合適的實際呼叫你的 代表 vue 使用規...
vue ui框架 你為什麼要使用前端框架Vue
1.前端框架的根本意義 1.1 前端框架的好處 最開始學習前端框架的時候 我第乙個框架是 react 並不理解框架能帶來什麼,只是因為大家都在用框架,最實際的乙個用途就是所有企業幾乎都在用框架,不用框架就 out 了.隨著使用的深入我逐漸理解到框架的好處 1.2 前端框架的根本意義 簡單來說,前端框...