ElementUI的el-cascade希望限制显示的宽度？

Question

代码：

<el-cascader
          v-model="selectedScoreItems"
          :options="itemOptionList"
          :props="props"
          @change="handleScoreItemChange"
        >
          <template
            slot="default"
            slot-scope="{ data }"
          >
            <el-tooltip
              :disabled="data.label.length < 15"
              class="cascader-item"
              effect="dark"
              :content="data.label"
              placement="top-start"
            >
              <span>{{ data.label }}</span>
            </el-tooltip>
          </template>
        </el-cascader>

按照网上的方法设置了css样式

.el-cascader-node {
  max-width: 250px;
}

但是不起作用，不知道是什么原因

Answer 1

通过这个 slot 做的吧？

<span>{{ data.label }}</span> 这里应该是截断或者省略号。不然不就全展示了嘛？

Answer 2

官网提供了popper-class属性，可以自定义css修改样式。