Django:在基于类的视图中包含媒体(css/js)

Posted

技术标签:

【中文标题】Django:在基于类的视图中包含媒体(css/js)【英文标题】:Django: Include Media (css/js) in Class-Based Views 【发布时间】:2017-05-26 08:31:54 【问题描述】:

我正在将旧的 django 代码从基于方法的视图更新为基于类的视图。

我知道如何通过Media class 在表单中包含媒体(css/js)

如果基于类的视图不包含任何表单,我该如何使用媒体类?

【问题讨论】:

如果静态文件与任何表单无关,则只需将它们放入您的 CBV 正在使用的 html 模板中 @v1k45 我的模板没有呈现整个页面。只是一个sn-p。 AFAIK js-includes 应该在<head> 中。我不知道如何在我的模板中包含一个 JS 文件,因为我想将包含在 <head> 中。 您可以通过扩展基本模板文件然后在 head% block % 中添加 js 文件来覆盖/扩展 head 标签中的代码。 see this 您的表单究竟是如何生成的? @Udi 视图中没有表单。我更新了措辞,也许现在更清楚了(我不是母语人士)。 【参考方案1】:

Django Sekizai 是为此而生的:

这是他们文档中的示例:

% load sekizai_tags %

<html>
<head>
% render_block "css" %
</head>
<body>
Your content comes here.
Maybe you want to throw in some css:
% addtoblock "css" %
<link href="/media/css/stylesheet.css" media="screen" rel="stylesheet" type="text/css" />
% endaddtoblock %
Some more content here.
% addtoblock "js" %
<script type="text/javascript">
alert("Hello django-sekizai");
</script>
% endaddtoblock %
And even more content.
% render_block "js" %
</body>
</html>

此示例在一个模板中显示所有内容,但是 - 当然 - 您可以通过继承或包含将其拆分为多个模板,并在任何部分模板中使用 addtoblock 指令。

一个更复杂的现实例子也是in their documentation。

【讨论】:

【参考方案2】:

CSS/JS 通常在模板本身而不是在视图中管理。见https://docs.djangoproject.com/en/1.10/howto/static-files/

例如使用base.html:

<!DOCTYPE html>
<html>
    <head>

        <title>
            % block page_title % page_title % endblock %
        </title>

        % block css %
        % endblock %

    </head>
    <body>

        % block main %
        % endblock %

        % block scripts %
        % endblock %

    </body>
</html>

并用 my_page.html 扩展它:

% extends "base.html" %
% load staticfiles %

% block page_title %
Hello!
% endblock %

% block css %
    <link href="% static "page.css" %" rel="stylesheet"/>
% endblock %

% block main %
Yo!
% endblock %

% block scripts %
    <script src="% static 'my_scripts.js' %"></script>
% endblock %

【讨论】:

你能举个例子吗?你提到的文档显示了这个&lt;img src="% static "my_app/example.jpg" %" alt="My image"/&gt;。但是如何在页面顶部添加 CSS/JS(我的模板使用继承)? 谢谢你的例子。如果我写一个可重用的应用程序。我可以确定基本模板(不是由应用程序提供,而是由项目提供)始终具有块 cssscripts 不,你不能。 :-) 我认为这是一个大问题。或者我错过了什么。 有什么问题?您的可重用应用程序的用户必须遵循一些关于如何将其集成到他们的模板中的说明?这一点也不罕见,我不认为这是你需要担心的事情。 @udi 的答案是可靠的。同样,这些都是向可能实现您的可重用应用程序的潜在最终用户询问的完全合理的事情。您可能唯一需要担心的是确保在文档中为最终用户提供足够的示例。【参考方案3】:

这是一个小型 mixin 类,可以帮助您将媒体添加到基于 CreateViewUpdateViewDeleteView 的视图中:

class InjectFormMediaMixin(object):
    def get_form_class(self):
        form_class = super(InjectFormMediaMixin, self).get_form_class()
        if hasattr(self, 'Media') and not hasattr(form_class, 'Media'):
            form_class.Media = self.Media
        return form_class

例子:

class CreateFooView(InjectFormMediaMixin, CreateView):
    model = models.Foo
    fields = (
        'name',
    )

    class Media:
        css = 
            'all': ('pretty.css',)
        
        js = ('animations.js', 'actions.js')

【讨论】:

我的视图不是CreateView 的子类。我猜get_form_class() 不会被调用。但我不确定。 请添加您的视图类,或尝试查找您的表单的创建位置。 我认为没有表格。看一下“关于”的例子。 AFAIK 不涉及任何形式:docs.djangoproject.com/en/1.10/topics/class-based-views/…

以上是关于Django:在基于类的视图中包含媒体(css/js)的主要内容,如果未能解决你的问题,请参考以下文章

如何根据 Django 中当前基于类的通用视图模型向模板加载器添加路径

从 Django 中基于类的通用视图将 request.user 对象发送到 ModelForm

基于 Django 类的视图 - 具有两个模型表单的 UpdateView - 一个提交

Django 基于类的视图是不是自动为模板分配表单值

从Django中基于类的通用视图向ModelForm发送request.user对象

如何在 django 中使用基于类的视图