el-tooltip changes width

popper-classAdd the Tooltipclass poppername using

 <el-tooltip
    effect="dark"
      :content="row.range"
      placement="top-start"
      popper-class="tool-tip"
    >
      <div class="td-nowrap">{
    
    {
    
     row.range }}</div>
</el-tooltip>

Create a new one in the current component style , don’t write it scoped. The styles here will be applied globally, so classthe naming must ensure that it does not overlap with other global class names.

<style lang="scss" scoped>
.td-nowrap {
    
    
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
</style>

<style>
.tool-tip {
    
    
  max-width: 400px;
}
</style>

Of course, you can also use it to customize the class name slotinslot
Insert image description here

Guess you like

Origin blog.csdn.net/weixin_44157964/article/details/126974233