修改el-tree 展开收起icon 的方法

修改el-tree 展开收起icon方法

先上效果图

<el-tree
      ref="tree"
      class="pageTree"
      :data="treeData"
      highlight-current
      :default-expanded-keys="defaultExpandedArr"
      :show-checkbox="checkedBox"
      :default-checked-keys="defaultCheckedArr"
      :props="defaultProps"
      node-key="id"
      @check='getCheckedNodes'
      @node-click="handleNodeClick"
   ></el-tree>

//element-ui 图标没有这两个图标，我用的FontAwesome

	<style lang="scss" scoped>
		.el-tree {
		  background: transparent !important;
		}
		.pageTree >>> [class*=" el-icon-"],
		[class^="el-icon-"] {
		  // 更换图标库
		  font-family: "FontAwesome" !important;
		}
		.pageTree >>> .el-tree-node__expand-icon.expanded {
		  // 动画取消
		  -webkit-transform: rotate(0deg);
		  transform: rotate(0deg);
		}
		.pageTree >>> .el-icon-caret-right:before {
		  // 收起
		  content: "\f196";
		  font-size: 18px;
		}
		.pageTree >>> .el-tree-node__expand-icon.expanded.el-icon-caret-right:before {
		  // 展开
		  content: "\f147";
		  font-size: 18px;
		}
	</style>

引入图标库我就不说了