新问网站设计,如何 网站优化,潍坊网站建设公司哪家好,网络营销服务是什么考虑到系统前端页面的美观程度#xff0c;通常通过Tag标签来代替某条数据中的状态信息。仅通过一点操作#xff0c;便能够使得页面美观程度得到较大提升#xff0c;前后对比如下所示。代码基于Vue以及Element-ui组件实现。 修改前#xff1a; 修改后#xff1a;
修改前…考虑到系统前端页面的美观程度通常通过Tag标签来代替某条数据中的状态信息。仅通过一点操作便能够使得页面美观程度得到较大提升前后对比如下所示。代码基于Vue以及Element-ui组件实现。 修改前 修改后
修改前的原始代码如下所示
el-table :datatableData border stripe header-cell-class-nameheaderBgColorel-table-column typeindex label编号 width100/el-table-columnel-table-column propname label数据集名称 width200/el-table-columnel-table-column proptime label上传时间 width200/el-table-columnel-table-column propstatus label可用状态 width200/el-table-column
/el-table修改后的代码如下所示 el-table :datatableData border stripe header-cell-class-nameheaderBgColorel-table-column typeindex label编号 width100/el-table-columnel-table-column propname label数据集名称 width200/el-table-columnel-table-column proptime label上传时间 width200/el-table-columnel-table-column propstatus label可用状态 width200template slot-scopescopeel-tag typesuccess v-ifscope.row.status 1可用/el-tagel-tag typedanger v-ifscope.row.status 0不可用/el-tag/template/el-table-column
/el-table
