其他分享
首页 > 其他分享> > vue技巧状态类展示使用红绿圆点

vue技巧状态类展示使用红绿圆点

作者:互联网

        <el-table-column prop="status" label="状态" width="70%" >
          <template slot-scope="scope" >
            <span slot="reference" v-if="scope.row.status == 1">
              <i class="dotClass" style="background-color: springgreen"></i>
            </span>
            <span slot="reference" v-if="scope.row.status == 0" >
              <i class="dotClass" style="background-color: red"></i>
            </span>
          </template>
        </el-table-column>
.dotClass {
  width:10px;
  height:10px;
  border-radius: 50%;
  display: block;
  margin-left: 10px;  //这个用于圆点居中
}

 

 参考:https://blog.csdn.net/Interest1_wyt/article/details/122203338

标签:vue,圆点,122203338,height,radius,10px,红绿,border
来源: https://www.cnblogs.com/zqlym/p/16295533.html