el-tree实现横向排列

el-tree部分按钮横向排列

1.自定义节点内容：render-content

el-tree标签中添加：   :render-content="renderContent"

2.添加两个方法

renderContent(h, { node, data }) {
	console.log(node, data)
	let classname = ''
	//1-导航；2-菜单；3-按钮
	if (data.type == 3) {
		classname = 'levelname'
	}
	return (
		<p class={classname}>{data.name}</p>
	)
},
changeCss() {
	// levelname是上面的最底层节点的名字
	var levelName = document.getElementsByClassName('levelname');
	for (var i = 0; i < levelName.length; i++) {
        // cssFloat 兼容 ie6-8  styleFloat 兼容ie9及标准浏览器
        levelName[i].parentNode.style.cssFloat = 'left';
        // 最底层的节点，包括多选框和名字都让他左浮动
        levelName[i].parentNode.style.styleFloat = 'left';
	}
},

3.获取完列表后执行changeCss（添加定时器以免）

setTimeout( ()=> {
	this.changeCss()
}, 50)

横向距离微调

/deep/ .levelname  {
  margin-right: 10px;
}