脚本宝典收集整理的这篇文章主要介绍了vue+element 后台管理系统（三）树形图，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。
<!DOCTYPE html>
<html class="over_hidd">
<head>
<meta charset="UTF-8">
<title>vue+element后台系统"</title>
<meta name="Author" content="Lee">
<meta name="Keywords" content="vue+element后台系统">
<link rel="stylesheet" href="css/public.css" />
<link rel="stylesheet" href="css/element.css" />
</head>
<body class="over_hidd">
<div id="app">
<el-tree
:data="data2"
show-checkbox
node-key="id"
:default-expanded-keys="[2, 3]"
:default-checked-keys="[5]"
:props="defaultProps">
</el-tree>
</div>
</body>
<script type="text/javascript" src="js/vue.js" ></script>
<script type="text/javascript" src="js/element.js" ></script>
<script>
new Vue({
el: '#app',
data() {
return {
data2: [{
id: 1,
label: '一级 1',
children: [{
id: 4,
label: '二级 1-1',
children: [{
id: 9,
label: '三级 1-1-1'
},{
id: 10,
label: '三级 1-1-2'
}]
}]
}, {
id: 2,
label: '一级 2',
children: [{
id: 5,
label: '二级 2-1'
},{
id: 6,
label: '二级 2-2'
}]
}, {
id: 3,
label: '一级 3',
children: [{
id: 7,
label: '二级 3-1'
},{
id: 8,
label: '二级 3-2'
}]
}],
defaultProps: {
children: 'children',
label: 'label'
}
};
}
})
</script>作者：攻城狮Lee丶
来源：CSDN
原文：https://blog.csdn.net/zhuogan...
版权声明：本文为博主原创文章，转载请附上博文链接！
以上是脚本宝典为你收集整理的vue+element 后台管理系统（三）树形图全部内容，希望文章能够帮你解决vue+element 后台管理系统（三）树形图所遇到的问题。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。