diff --git a/assets/iview.png b/assets/iview.png
index 2094143e..5379c756 100644
Binary files a/assets/iview.png and b/assets/iview.png differ
diff --git a/src/components/menu/index.js b/src/components/menu/index.js
new file mode 100644
index 00000000..b5cd7488
--- /dev/null
+++ b/src/components/menu/index.js
@@ -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;
\ No newline at end of file
diff --git a/src/components/menu/menu-group.vue b/src/components/menu/menu-group.vue
new file mode 100644
index 00000000..f67cf44d
--- /dev/null
+++ b/src/components/menu/menu-group.vue
@@ -0,0 +1,13 @@
+<template>
+
+</template>
+<script>
+    export default {
+        props: {},
+        data () {
+            return {}
+        },
+        computed: {},
+        methods: {}
+    }
+</script>
\ No newline at end of file
diff --git a/src/components/menu/menu-item.vue b/src/components/menu/menu-item.vue
new file mode 100644
index 00000000..f67cf44d
--- /dev/null
+++ b/src/components/menu/menu-item.vue
@@ -0,0 +1,13 @@
+<template>
+
+</template>
+<script>
+    export default {
+        props: {},
+        data () {
+            return {}
+        },
+        computed: {},
+        methods: {}
+    }
+</script>
\ No newline at end of file
diff --git a/src/components/menu/menu.vue b/src/components/menu/menu.vue
new file mode 100644
index 00000000..f67cf44d
--- /dev/null
+++ b/src/components/menu/menu.vue
@@ -0,0 +1,13 @@
+<template>
+
+</template>
+<script>
+    export default {
+        props: {},
+        data () {
+            return {}
+        },
+        computed: {},
+        methods: {}
+    }
+</script>
\ No newline at end of file
diff --git a/src/components/menu/submenu.vue b/src/components/menu/submenu.vue
new file mode 100644
index 00000000..f67cf44d
--- /dev/null
+++ b/src/components/menu/submenu.vue
@@ -0,0 +1,13 @@
+<template>
+
+</template>
+<script>
+    export default {
+        props: {},
+        data () {
+            return {}
+        },
+        computed: {},
+        methods: {}
+    }
+</script>
\ No newline at end of file
diff --git a/src/index.js b/src/index.js
index 2036c815..349670dc 100644
--- a/src/index.js
+++ b/src/index.js
@@ -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,
diff --git a/src/styles/components/index.less b/src/styles/components/index.less
index 754c3722..79404b6f 100644
--- a/src/styles/components/index.less
+++ b/src/styles/components/index.less
@@ -30,4 +30,5 @@
 @import "transfer";
 @import "table";
 @import "dropdown";
-@import "tabs";
\ No newline at end of file
+@import "tabs";
+@import "menu";
\ No newline at end of file
diff --git a/src/styles/components/menu.less b/src/styles/components/menu.less
new file mode 100644
index 00000000..e69de29b
diff --git a/test/routers/tabs.vue b/test/routers/tabs.vue
index dfaa187d..28d984c6 100644
--- a/test/routers/tabs.vue
+++ b/test/routers/tabs.vue
@@ -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>
-    </div>
+    <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>
 </template>
 <script>
     export default {
-        props: {
 
-        },
-        data () {
-            return {
-                closable: true
-            }
-        },
-        computed: {
-
-        },
-        methods: {
-            toggleClose () {
-                this.closable = !this.closable;
-            }
-        }
     }
-</script>
\ No newline at end of file
+</script>