前段时间在Vue3框架的基础上安装了element-plus, 我天真的以为改动应该不是很大,应该和Vue2大同小异,结局可想而知我错的一败涂地,这他喵玩完全另一个风格。
今天使用element-plus 中的表格组件想体验一把,本想在表格最后一行追加一行,可思想还停留在Vue2那老一套的方法上面,使用slot='append'死活出不来,懵逼了一大会,猛然想到这已经是Vue3了,原来已经过时了。
不多比比 下面代码
<el-table :summary-method='ooooo' id="out-table" :data="tableData" style="width: 80%; border: 1px solid rgab(0,0,0,0); margin: 100px auto"> <el-table-column prop="date" label="日期" width="150"> </el-table-column> <el-table-column label="配送信息"> <el-table-column prop="name" label="姓名" width="120"> </el-table-column> <el-table-column label="地址"> <el-table-column label="省份" width="120"> <template #default="scope"> <el-select v-model="value" placeholder="请选择"> <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" > </el-option> </el-select> </template> </el-table-column> <el-table-column prop="city" label="市区" > </el-table-column> <el-table-column prop="address" label="地址" > </el-table-column> <el-table-column prop="zip" label="邮编" > </el-table-column> </el-table-column> </el-table-column> <template #append> <div style="width: 100%; height: 80px; border: 1px solid pink;"> <button @click="addSubmit">submit</button> </div> </template> </el-table>