元件 一 插槽

2021-09-24 02:55:30 字數 381 閱讀 1830

假如元件標籤名是 demo

元件模板 template

元件標籤

元件宣告 export default

元件插槽 元件標籤定義插槽 元件模板接受插槽的內容[父元件在子元件標籤的標籤體定義並分發內容,分發到這個子元件本身]

元件模板

描述元件本身的結構,可以接受元件標籤內容區傳來的標籤【slot】

元件標籤

接受父級標籤引數 可以由父元件傳遞引數,本元件在定義部分用props接受

元件宣告

定義資料,和其他元件的關係 定義自己的data methods computed components mounted

元件插槽

元件標籤的內容區域,給元件模板的slot標籤傳遞標籤

元件 插槽 匿名插槽 具名插槽

單個插槽 匿名插槽 1.1 子元件定義為 1.2 父元件向一下這樣使用子元件 your profile 1.3渲染出來的 html 將會是 your profile 需要多個插槽時,可以利用元素的乙個特殊的特性 name來定義具名插槽2.1子元件模板定義 2.2.1父元件使用子元件,節點上使用slo...

Vue元件插槽

三 具名插槽 命名插槽 補充當我們使用vue元件時,常常遇到子元件的部分布局在不同的路由元件上表現不同的情況,vue為了幫助我們開發者解決這個問題,新增了插槽這個功能 插槽即佔位符 實現元件在不同父元件中使用,內部可以有不一樣 塊 html 如下 示例 如下 示例 當乙個子元件內,需要多個插槽時,需...

元件間使用插槽

template slot scope scope div div div div template el table column el table column prop money min width 100 label 押金 租金 付款方式 1.列表項 在table 裡可以插入模板 模板裡可...