init Menu components

init Menu components
This commit is contained in:
梁灏 2016-12-07 12:10:47 +08:00
parent 9fc59aa69c
commit 8778b3435d
10 changed files with 75 additions and 31 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 163 KiB

After

Width:  |  Height:  |  Size: 162 KiB

View file

@ -0,0 +1,10 @@
import Menu from './menu.vue';
import MenuGroup from './menu-group.vue';
import MenuItem from './menu-item.vue';
import Submenu from './submenu.vue';
Menu.Group = MenuGroup;
Menu.Item = MenuItem;
Menu.Sub = Submenu;
export default Menu;

View file

@ -0,0 +1,13 @@
<template>
</template>
<script>
export default {
props: {},
data () {
return {}
},
computed: {},
methods: {}
}
</script>

View file

@ -0,0 +1,13 @@
<template>
</template>
<script>
export default {
props: {},
data () {
return {}
},
computed: {},
methods: {}
}
</script>

View file

@ -0,0 +1,13 @@
<template>
</template>
<script>
export default {
props: {},
data () {
return {}
},
computed: {},
methods: {}
}
</script>

View file

@ -0,0 +1,13 @@
<template>
</template>
<script>
export default {
props: {},
data () {
return {}
},
computed: {},
methods: {}
}
</script>

View file

@ -17,6 +17,7 @@ import Icon from './components/icon';
import Input from './components/input';
import InputNumber from './components/input-number';
import LoadingBar from './components/loading-bar';
import Menu from './components/menu';
import Message from './components/message';
import Modal from './components/modal';
import Notice from './components/notice';
@ -60,6 +61,10 @@ const iview = {
iInput: Input,
InputNumber,
LoadingBar,
Menu,
MenuGroup: Menu.Group,
MenuItem: Menu.Item,
Submenu: Menu.Sub,
Message,
Modal,
Notice,

View file

@ -31,3 +31,4 @@
@import "table";
@import "dropdown";
@import "tabs";
@import "menu";

View file

View file

@ -1,36 +1,12 @@
<template>
<i-button @click="toggleClose">closable</i-button>
<div style="margin:20px;width:400px">
<Tabs type="line" :closable="closable" 3399ff>
<Tab-pane label="Tab 1">Tab1 content</Tab-pane>
<Tab-pane label="Tab 2" icon="ionic">Tab2 content</Tab-pane>
<Tab-pane label="Tab 3" disabled>Tab3 content</Tab-pane>
<Tab-pane label="Tab 4">Tab4 content</Tab-pane>
<Tab-pane label="Tab 5">Tab5 content</Tab-pane>
<Tab-pane label="Tab 6" icon="ionic">Tab6 content</Tab-pane>
<Tab-pane label="Tab 7" disabled>Tab7 content</Tab-pane>
<Tab-pane label="Tab 888888888">Tab8 content</Tab-pane>
<Tabs size="small">
<Tab-pane label="macOS" icon="social-apple">标签一的内容</Tab-pane>
<Tab-pane label="Windows" icon="social-windows">标签二的内容</Tab-pane>
<Tab-pane label="Linux" icon="social-tux">标签三的内容</Tab-pane>
</Tabs>
</div>
</template>
<script>
export default {
props: {
},
data () {
return {
closable: true
}
},
computed: {
},
methods: {
toggleClose () {
this.closable = !this.closable;
}
}
}
</script>