效果圖1、row-click 點選行
2、ref 自行了解vue
3、togglerowexpansion
togglerowexpansion() // 引數1是單擊行的row,引數2是true 或者false
<template
>
<
el-table
:data
="tabledata5"
@row-click
="clicktable"
ref="reftable"
style
="width: 100%"
>
<
el-table-column
type
="expand"
>
<
template
slot-scope
="props"
>
<
el-form
label-position
="left"
inline class
="demo-table-expand"
>
<
el-form-item
label
="商品名稱"
>
<
span
>}
span
>
el-form-item
>
<
el-form-item
label
="所屬店鋪"
>
<
span
>}
span
>
el-form-item
>
<
el-form-item
label
="商品 id"
>
<
span
>}
span
>
el-form-item
>
<
el-form-item
label
="店鋪 id"
>
<
span
>}
span
>
el-form-item
>
<
el-form-item
label
="商品分類"
>
<
span
>}
span
>
el-form-item
>
<
el-form-item
label
="店鋪位址"
>
<
span
>}
span
>
el-form-item
>
<
el-form-item
label
="商品描述"
>
<
span
>}
span
>
el-form-item
>
el-form
>
template
>
el-table-column
>
<
el-table-column
label
="商品 id"
prop
="id"
>
el-table-column
>
<
el-table-column
label
="商品名稱"
prop
="name"
>
el-table-column
>
<
el-table-column
label
="描述"
prop
="desc"
>
el-table-column
>
el-table
>
template
>
<
style
>
.demo-table-expand
.demo-table-expand label
.demo-table-expand .el-form-item
style
>
<
script
>
export
default
, , , ]}},
methods:
}script
>
React中tab欄的實現
父元件的 展示 constructor props render this state 通過解構,下面直接拿到資料 return this.itemclick index titles 子元件 itemclick index this state const titles name console....
element ui實現前端分頁
element ui裡的分頁元件 size change handlesizechange current change handlecurrentchange current page page page sizes 20,50,100 background page size limit lay...
elementUI實現前端分頁
按照他的文件來寫分頁,最主要的是el table裡面展示的資料怎麼處理 最主要就是上面標紅這一塊的處理 allcommoditylist是後台取得資料,currentpage是當前頁,初始值0,pagesize當前需要展示的資料,初始值10 slice 方法從已有陣列中返回選定的資料 最主要就是上面...