使用Django Components类继承时重复加载媒体资源问题求助

这问题本质是django-components处理继承组件的Media资源时，会默认关联同个父类下所有子类的Media，导致调用单个子类组件时，兄弟子类的资源也被错误加载。以下是几个实测有效的解决方法：

1. 给子类Media显式设置extend=False #

django-components的Media类默认extend=True，会自动继承父类的Media，但这会导致父类关联的所有子类Media被合并收集。我们可以让每个子类的Media完全独立，手动包含父类的资源：

class Parent(Component):
    class Media:
        css = {"all": ("common.css",)}
        js = ("common.js",)

class ChildA(Parent):
    class Media(Parent.Media):
        extend = False  # 禁用自动继承，避免关联其他子类资源
        css = {"all": ("common.css", "childa.css")}  # 手动加入父类+自身CSS
        js = ("common.js", "childa.js")  # 手动加入父类+自身JS

class ChildB(Parent):
    class Media(Parent.Media):
        extend = False
        css = {"all": ("common.css", "childb.css")}
        js = ("common.js", "childb.js")

2. 确保父类仅作为基类，不注册为组件 #

别把Parent类注册成组件，只注册子类ChildA和ChildB：

# 只注册子类组件
register("aaa", ChildA)
register("bbb", ChildB)

# 绝对不要注册Parent！
# register("parent", Parent)  # 这条要删掉

父类一旦被注册，django-components会把所有继承它的子类Media都归到父类名下，调用任何子类组件都会加载所有关联资源。

3. 重写子类的get_media方法 #

如果上面的方法不生效，可以直接重写子类的get_media方法，强制返回当前子类的Media资源：

class ChildA(Parent):
    def get_media(self):
        # 初始化空Media对象，避免继承父类的关联资源
        media = Media()
        media.add_css({"all": ("common.css", "childa.css")})
        media.add_js(("common.js", "childa.js"))
        return media

class ChildB(Parent):
    def get_media(self):
        media = Media()
        media.add_css({"all": ("common.css", "childb.css")})
        media.add_js(("common.js", "childb.js"))
        return media

4. 检查模板中的Media渲染标签 #

如果你用了{% component_media %}全局标签，它会加载所有已注册组件的Media。要改成指定组件的标签：

# 只加载"aaa"组件的Media
{% component_media "aaa" %}

或者直接用组件标签自带的Media加载（默认组件标签会自动加载自身Media）：

{% component "aaa" data="" %}

调整完后测试一下，调用{% component "aaa" %}时，HTML里应该只有ChildA的CSS和JS，不会出现ChildB的资源。

内容的提问来源于stack exchange，提问作者y.dai