From 4503676cbf8349f5d872a3fb4f61585a635af7ca Mon Sep 17 00:00:00 2001
From: Harvey Zack <laozhaochaguan@gmail.com>
Date: Wed, 12 Jun 2019 17:08:45 +0800
Subject: [PATCH] add componentID

---
 packages/artplayer/src/utils/component.js | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/packages/artplayer/src/utils/component.js b/packages/artplayer/src/utils/component.js
index 4dea4e855..31d326dc9 100644
--- a/packages/artplayer/src/utils/component.js
+++ b/packages/artplayer/src/utils/component.js
@@ -3,7 +3,8 @@ import { append, setStyles, setStyle, remove, errorHandle, hasOwnProperty } from
 export default function component(art, parent, target, getOption, callback, title) {
     const option = typeof getOption === 'function' ? getOption(art) : getOption;
     if (!option.disable) {
-        const name = option.name || `${title}${parent.id}`;
+        const componentID = parent.id;
+        const name = option.name || `${title}${componentID}`;
         errorHandle(
             !hasOwnProperty(parent, name),
             `Cannot create a component that already has the same name: ${title} -> ${name}`,
@@ -20,7 +21,7 @@ export default function component(art, parent, target, getOption, callback, titl
         }
 
         const childs = Array.from(target.children);
-        $element.dataset.index = option.index || parent.id;
+        $element.dataset.index = option.index || componentID;
         const nextChild = childs.find(item => Number(item.dataset.index) >= Number($element.dataset.index));
         if (nextChild) {
             nextChild.insertAdjacentElement('beforebegin', $element);
@@ -47,7 +48,7 @@ export default function component(art, parent, target, getOption, callback, titl
         Object.defineProperty(parent, name, {
             value: {
                 get id() {
-                    return parent.id;
+                    return componentID;
                 },
                 get $ref() {
                     return $element;