<template>
  <div class="uif-tree">
    <u-tree-item v-for="(item, i) in data" :key="i" v-bind="$attrs" :data="item" :active="active"
              @choose="onChoose" v-on="$listeners"></u-tree-item>
  </div>
</template>

<script>
import UTreeItem from './tree-item'

export default {
  inheritAttrs: false,
  name: 'u-tree',
  components: {
    UTreeItem
  },
  props: {
    value: {
      default: null
    },
    // 节点数据
    data: {
      type: Array,
      default () {
        return []
      }
    }
  },
  data () {
    return {
      active: this.value
    }
  },
  watch: {
    value () {
      if (this.active !== this.value) {
        this.active = this.value
      }
    }
  },
  methods: {
    onChoose (value) {
      this.active = value
      this.$emit('input', value)
    }
  }
}
</script>
