给table中单元格设置样式

最新推荐文章于 2024-09-25 15:57:19 发布

sunshine 覃糖

最新推荐文章于 2024-09-25 15:57:19 发布

阅读量762

点赞数

文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/tan_xiao_tan/article/details/121061633

版权

本文介绍如何在前端开发中针对表格的单元格应用特定样式，以实现输入框提示效果，避免使用input框并禁用输入，提高用户体验。

摘要由CSDN通过智能技术生成

之前有个需给table中的input框根据要求添加相应的样式,
并且不可以输入,只是一个提示的作用,因此想着这样设计不太理想,
干脆给单元格设置样式?

<div>
<el-button v-if="constract.list" @click="hanleCell">切换</el-button>
 <el-form :model="constract" ref="constract">
      <el-table
        :data="constract.list"
        border
        style="width: 100%"
        :cell-class-name="cellName"
      >
        <el-table-column prop="name" label="名称" width="200">
        </el-table-column>
        <el-table-column prop="typeOne" label="类型一" width="200">
        <!--<el-form-item slot-scope="scope">
              <el-input v-model="scope.row.typeOne"></el-input>
          </el-form-item> -->
        </el-table-column>
        <el-table-column prop="typeTwo" label="类型二" width="200">
          <!--<el-form-item slot-scope="scope">
              <el-input v-model="scope.row.typeTwo "></el-input><