diff --git a/src/sidebar-item/index.js b/src/sidebar-item/index.js
index 22ae3b7e1..502291a09 100644
--- a/src/sidebar-item/index.js
+++ b/src/sidebar-item/index.js
@@ -1,6 +1,6 @@
 import { createNamespace } from '../utils';
+import { useParent } from '../composition/use-relation';
 import { useRoute, routeProps } from '../composition/use-route';
-import { useParent } from '../composition/use-parent';
 import { SIDEBAR_KEY } from '../sidebar';
 import Badge from '../badge';
 
diff --git a/src/sidebar/index.js b/src/sidebar/index.js
index 6f378b39a..bc5cb955f 100644
--- a/src/sidebar/index.js
+++ b/src/sidebar/index.js
@@ -1,5 +1,6 @@
-import { watch, provide, reactive } from 'vue';
+import { watch } from 'vue';
 import { createNamespace } from '../utils';
+import { useChildren } from '../composition/use-relation';
 
 const [createComponent, bem] = createNamespace('sidebar');
 
@@ -16,8 +17,10 @@ export default createComponent({
   emits: ['change', 'update:modelValue'],
 
   setup(props, { emit, slots }) {
-    const children = reactive([]);
+    const { linkChildren } = useChildren(SIDEBAR_KEY);
+
     const active = () => +props.modelValue;
+
     const setActive = (value) => {
       if (value !== active()) {
         emit('change', value);
@@ -26,10 +29,9 @@ export default createComponent({
 
     watch(active, setActive);
 
-    provide(SIDEBAR_KEY, {
+    linkChildren({
       emit,
       active,
-      children,
       setActive,
     });