vue3修改el-tree样式

vue3修改el-tree样式

			:deep(.el-tree) {
				width: 100%;
				.el-tree-node {
					.el-tree-node__content {
						height: 32px;
						.hightlight {
							color: #189cf1;
						}

						.el-tree-node__expand-icon {
							// transform: rotate(0);
							transform-origin: center;
							background: url('/@/assets/images/dataResource/tree_arrow.png') no-repeat;
							color: transparent;
							width: 16px;
							height: 16px;
							padding: 0;
							margin-right: 8px;
							margin-left: 8px;
						}
						.custom-tree-node {
							flex: 1;
							display: flex;
							align-items: center;
							justify-content: space-between;
							font-size: 14px;
							padding-right: 8px;
							.arrow-icon {
								width: 16px;
								height: 16px;
								background: url('/@/assets/images/dataResource/arrow_up.png') no-repeat;
								transform: rotate(180deg);
							}
						}
						.expanded + .custom-tree-node {
							.arrow-icon {
								transform: rotate(0deg);
							}
						}
						.is-leaf + .custom-tree-node {
							.arrow-icon {
								background: none;
							}
						}
					}
					// .el-tree-node__children {
					// 	.el-tree-node {
					// 		.el-tree-node__content {
					// 			.el-tree-node__expand-icon {
					// 				background: none;
					// 				color: transparent;
					// 			}
					// 		}
					// 	}
					// }
				}
			}