element - ui tree

一行代码两行泪，没有外网真可怕！好久没写博客了，更新一把。

 <template>
  <div>
    <el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick"></el-tree>

   </div>
 </template>

 <script>
 export default {
   data () {
     return {
      data: [{
           label: '一级 1',
           children: [{
             label: '二级 1-1',
             children: [{
               label: '三级 1-1-1'
             }]
           }]
         }, {
           label: '一级 2',
           children: [{
             label: '二级 2-1',
             children: [{
               label: '三级 2-1-1'
             }]
           }, {
             label: '二级 2-2',
             children: [{
               label: '三级 2-2-1'
             }]
           }]
         }, {
           label: '一级 3',
           children: [{
             label: '二级 3-1',
             children: [{
               label: '三级 3-1-1'
             }]
           }, {
             label: '二级 3-2',
             children: [{
               label: '三级 3-2-1'
             }]
           }]
         }],
         defaultProps: {
           children: 'children',
           label: 'label'
         }
     }
   },
   methods: {
       handleNodeClick(data) {
         console.log(data);
       }
     }
 }
 </script>

 <style scoped>

 </style>

// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);
Vue.config.productionTip = false

/* eslint-disable no-new */
new Vue({
  el: '#app',
  components: { App },
  template: '<App/>'
})