el-table的列表渲染

最新推荐文章于 2024-08-15 23:24:24 发布

csdoge

最新推荐文章于 2024-08-15 23:24:24 发布

阅读量668

点赞数 1

文章标签： vue.js elementui

本文链接：https://blog.csdn.net/Ted_az/article/details/127067342

版权

直接上代码


<el-table :data="showData" border style="width: 100%" stripe>
                <el-table-column v-for="(item, index) in items" :prop=item :label="labels[index]" :key="index"
                    width="245" align="center" show-overflow-tooltip>
                    <template slot-scope="scope">      
                       <span :style="{color:(scope.row.error == 1 ? 'red' : '#000')}">{{scope.row[item]}}</span>
                    </template>
                </el-table-column>
            </el-table>

export default {
    data() {
        return {
            items: ["id", "name", "sex", "time", "place", "result"],
            labels: ["身份证号", "姓名", "性别", "检测时间", "站点编号", "检测结果"],
            showdata: [{"id":"320981200205192415","name":"赵非","sex":"男","time":"2022-09-25-17:28:05","place":"L1","result":"waiting","inde":2,"flag":false,"error":0}]
            }