Element-ui中Cascader组件数据太长显示不全、宽度限制的解决方案

920 阅读1分钟

级联下拉

Element-ui中Cascader组件数据太长显示不全的解决方案

image.png 解决方案:给.el-cascader-panel指定高度,在全局css中根据需要设置就行了~~

.el-cascader-panel {
  max-height: 300px!important;
}

element里面的el-cascader组件宽度限制

blog.csdn.net/qq_44473483…

.el-cascader-node {
  max-width: 250px;
}
<el-cascader
 v-model="value"
 :options="list">
   <template slot-scope="{ data }">
     <el-tooltip
       :disabled="data.label.length < 12"
       class="item"
       effect="dark"
       :content="data.label"
       placement="right"
     >
      <span>{{ data.label }}</span>
    </el-tooltip>
  </template>
</el-cascader>