Tree support transition
This commit is contained in:
parent
b80c48ffce
commit
eae3e936c8
1 changed files with 15 additions and 14 deletions
|
@ -1,32 +1,33 @@
|
||||||
<template>
|
<template>
|
||||||
<transition name="slide-up">
|
<collapse-transition>
|
||||||
<ul :class="classes" v-show="visible">
|
<ul :class="classes" v-show="visible">
|
||||||
<li>
|
<li>
|
||||||
<span :class="arrowClasses" @click="handleExpand">
|
<span :class="arrowClasses" @click="handleExpand">
|
||||||
<Icon type="arrow-right-b"></Icon>
|
<Icon type="arrow-right-b"></Icon>
|
||||||
</span>
|
</span>
|
||||||
<Checkbox
|
<Checkbox
|
||||||
v-if="showCheckbox"
|
v-if="showCheckbox"
|
||||||
:value="data.checked"
|
:value="data.checked"
|
||||||
:indeterminate="indeterminate"
|
:indeterminate="indeterminate"
|
||||||
:disabled="data.disabled || data.disableCheckbox"
|
:disabled="data.disabled || data.disableCheckbox"
|
||||||
@click.native.prevent="handleCheck"></Checkbox>
|
@click.native.prevent="handleCheck"></Checkbox>
|
||||||
<span :class="titleClasses" v-html="data.title" @click="handleSelect"></span>
|
<span :class="titleClasses" v-html="data.title" @click="handleSelect"></span>
|
||||||
<Tree-node
|
<Tree-node
|
||||||
v-for="item in data.children"
|
v-for="item in data.children"
|
||||||
:key="item"
|
:key="item"
|
||||||
:data="item"
|
:data="item"
|
||||||
:visible="data.expand"
|
:visible="data.expand"
|
||||||
:multiple="multiple"
|
:multiple="multiple"
|
||||||
:show-checkbox="showCheckbox">
|
:show-checkbox="showCheckbox">
|
||||||
</Tree-node>
|
</Tree-node>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</transition>
|
</collapse-transition>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import Checkbox from '../checkbox/checkbox.vue';
|
import Checkbox from '../checkbox/checkbox.vue';
|
||||||
import Icon from '../icon/icon.vue';
|
import Icon from '../icon/icon.vue';
|
||||||
|
import CollapseTransition from '../base/collapse-transition';
|
||||||
import Emitter from '../../mixins/emitter';
|
import Emitter from '../../mixins/emitter';
|
||||||
import { findComponentsDownward } from '../../utils/assist';
|
import { findComponentsDownward } from '../../utils/assist';
|
||||||
|
|
||||||
|
@ -35,7 +36,7 @@
|
||||||
export default {
|
export default {
|
||||||
name: 'TreeNode',
|
name: 'TreeNode',
|
||||||
mixins: [ Emitter ],
|
mixins: [ Emitter ],
|
||||||
components: { Checkbox, Icon },
|
components: { Checkbox, Icon, CollapseTransition },
|
||||||
props: {
|
props: {
|
||||||
data: {
|
data: {
|
||||||
type: Object,
|
type: Object,
|
||||||
|
|
Loading…
Add table
Reference in a new issue