el-tree自动换行

要实现el-tree的自动换行，可以使用CSS的white-space属性。在给.el-tree-node__content类添加样式时，将white-space属性设置为normal。具体的scss代码如下：

.tree {
  .el-tree-node {
    white-space: normal;
    .el-tree-node__content {
      height: 100%;
      align-items: start;
    }
  }
}

同时，在HTML代码中，将el-tree组件包裹在一个具有.tree类的div中即可。

<div class='tree'>
  <el-tree :data="zptreeDate" :props="defaultProps" style="font-size:13px" accordion default-expand-all node-key :highlight-current="true" :expand-on-click-node="false" @node-click="clickNode">
    <span class="custom-tree-node" slot-scope="{ node, data }">
      <span>{{ node.label }}</span>
      <span v-if='data.craft_code!=null'>({{data.craft_code}})</span>
    </span>
  </el-tree>
</div>

这样设置之后，el-tree的内容就可以在需要的地方自动换行了。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* [element的tree设置可以换行,不换行显示省略号](https://blog.csdn.net/qq_41619796/article/details/115736782)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
- *2* *3* [element UI + Vue 中 el-tree 超出部分自动换行](https://blog.csdn.net/weixin_45502872/article/details/115523347)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]