vue el-tooltip 提示黑框遮挡问题

在用于文字过长提示的时候，如果输入框为空。就会出现黑框遮挡问题。解决方法：例：<el-table-column prop='Remark' :label='trInvoiceBatch.Remark.Name' show-overflow-tooltip v-if="!readOnly"><template scope='scope

小蘑菇0629

4525人浏览 · 2018-11-27 15:43:01

小蘑菇0629 · 2018-11-27 15:43:01 发布

在用于文字过长提示的时候，如果输入框为空。就会出现黑框遮挡问题。

解决方法：

例：

 <el-table-column prop='Remark' :label='trInvoiceBatch.Remark.Name' show-overflow-tooltip v-if="!readOnly">
          <template scope='scope'>
            <el-tooltip class="item" effect="dark" :content="scope.row.Remark" placement="top-start" :disabled="scope.row.Remark.length<5">
            <el-input size='small' v-model='scope.row.Remark' @change='setRowStateType(scope.row)'></el-input>
            </el-tooltip>
          </template>
        </el-table-column>

使用 :disabled="scope.row.Remark.length<5" 来解决问题

贴上 el-tooltip 的详细用法

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^