Collapse: fix $parent bug when collapse-item is nested in other components (#7675)

* fix collapse  bug

* fix code style

packages/collapse/src/collapse-item.vue

@@ -62,6 +62,8 @@
       };
     },
 
+    inject: ['collapse'],
+
     props: {
       title: String,
       name: {
@@ -74,18 +76,13 @@
 
     computed: {
       isActive() {
-        return this.$parent.activeNames.indexOf(this.name) > -1;
+        return this.collapse.activeNames.indexOf(this.name) > -1;
       },
       id() {
         return generateId();
       }
     },
 
-    watch: {
-      'isActive'(value) {
-      }
-    },
-
     methods: {
       handleHeaderClick() {
         this.dispatch('ElCollapse', 'item-click', this);
@@ -94,9 +91,6 @@
       handleEnterClick() {
         this.dispatch('ElCollapse', 'item-click', this);
       }
-    },
-
-    mounted() {
     }
   };
 </script>

packages/collapse/src/collapse.vue

@@ -25,6 +25,12 @@
       };
     },
 
+    provide() {
+      return {
+        collapse: this
+      };
+    },
+
     watch: {
       value(value) {
         this.activeNames = [].concat(value);