fix: sidenavbar index.js child compontents

src/packages/sidenavbar/index.js

@@ -1,8 +1,12 @@
 import SideNavBar from './sidenavbar.vue';
 import './sidenavbar.scss';
-
-SideNavBar.install = function(Vue) {
+import Subsidenavbar from '../subsidenavbar/subsidenavbar.vue';
+import Sidenavbaritem from '../sidenavbaritem/sidenavbaritem.vue';
+import Icon from '../icon/icon.vue';
+SideNavBar.install = function (Vue) {
   Vue.component(SideNavBar.name, SideNavBar);
+  Vue.component(Subsidenavbar.name, Subsidenavbar);
+  Vue.component(Sidenavbaritem.name, Sidenavbaritem);
+  Vue.component(Icon.name, Icon);
 };
-
 export default SideNavBar

src/packages/sidenavbar/sidenavbar.scss

@@ -1,3 +1,6 @@
+@import  "../subsidenavbar/subsidenavbar.scss";
+@import  "../icon/icon.scss";
+@import  "../sidenavbaritem/sidenavbaritem.scss";
 .nut-sidenavbar{
     height: 100%;
     overflow: auto;

src/packages/sidenavbar/sidenavbar.vue

@@ -8,34 +8,27 @@
     </div>
 </template>
 <script>
-import Icon from '../icon/icon.vue';
-import '../icon/icon.scss';
-import Subsidenavbar from '../subsidenavbar/subsidenavbar.vue';
-import '../subsidenavbar/subsidenavbar.scss';
-import Sidenavbaritem from '../sidenavbaritem/sidenavbaritem.vue';
-import '../sidenavbaritem/sidenavbaritem.scss';
 export default {
-    name:'nut-sidenavbar',
+    name: "nut-sidenavbar",
     props: {
-        offset:{
-            type:[String,Number],
-            default:15
+        offset: {
+            type: [String, Number],
+            default: 15
         }
     },
-    components: {
-        'nut-icon': Icon,
-        'nut-subsidenavbar': Subsidenavbar,
-        'nut-sidenavbaritem': Sidenavbaritem,
-    },
     mounted() {
-        this.observer = new MutationObserver(function(mutations) {
-            this.handleSlots()
-        }.bind(this));
-
-        this.observer.observe(
-            this.$refs.list,
-            { attributes: true, childList: true, characterData: true, subtree: true }
+        this.observer = new MutationObserver(
+            function(mutations) {
+                this.handleSlots();
+            }.bind(this)
         );
+
+        this.observer.observe(this.$refs.list, {
+            attributes: true,
+            childList: true,
+            characterData: true,
+            subtree: true
+        });
     },
     data() {
         return {
@@ -46,23 +39,28 @@ export default {
     methods: {
         handleSlots() {
             let slots = this.$slots.default;
-            if(slots) {
-                slots = slots.filter(item => item.elm.nodeType !== 3).map(item => {
-                    return item.elm
-                })
-                this.setPaddingLeft(slots)
+            if (slots) {
+                slots = slots
+                    .filter(item => item.elm.nodeType !== 3)
+                    .map(item => {
+                        return item.elm;
+                    });
+                this.setPaddingLeft(slots);
             }
         },
         setPaddingLeft(nodeList, level = 1) {
-            for(let i = 0; i < nodeList.length; i++) {
+            for (let i = 0; i < nodeList.length; i++) {
                 let item = nodeList[i];
-                item.children[0].style.paddingLeft = this.offset * level + 'px'
-                if(item.className !== 'nut-sidenavbaritem') {
-                    this.setPaddingLeft(Array.from(item.children[1].children), ++this.count)
+                item.children[0].style.paddingLeft = this.offset * level + "px";
+                if (item.className !== "nut-sidenavbaritem") {
+                    this.setPaddingLeft(
+                        Array.from(item.children[1].children),
+                        ++this.count
+                    );
                 }
             }
             this.count = 1;
         }
     }
-}
+};
 </script>