我正在做一个有很多共享元素的项目,例如页脚、页眉、导航等。我在 View 中扩展的布局很少。现在,我正在我的 View 中加载共享元素,但我需要在我正在加载它的 View 中提供每个共享元素所需的所有 Assets (依赖项)。我希望能够跳过该步骤并加载实际准备立即使用的元素(这样我就不需要记住所有相关的 javascript 和 css 文件,因为其中一些可能有一些) .
我正在考虑在元素 View 中指定共享元素所需的所有 Assets ,因此当我包含我需要的元素时,它会“自动”加载 Assets ,而无需我在我的 View 中指定所有 Assets 。所以我的问题是,是否有可能做到这一点,或者实现这一目标的正确方法是什么?
希望使用代码能更好地解释它:
结构:
views/
- /layout/
-> layout.twig
- /homepage/
-> index.twig
- /shared/
-> navigation.twig
布局:
<!-- HTML headers, etc. -->
{% block assets %}
<link rel="stylesheet" href="xxx" />
{% endblock %}
{% block content %}
{% endblock %}
查看:
{% extends "layout/layout.twig" %}
{% block assets %}
{{ parent() }}
<!-- some assets for view -->
{% endblock %}
{% block content %}
{% include "shared/navigation.twig" %}
<!-- content -->
{% endblock %}
共享元素 navigation.twig:
// It's not working, of course - just for better explanation of what I'm trying to approach
{% block assets %}
{{ parent() }}
<!-- assets needed for shared element -->
{% endblock %}
<!-- rest of shared element -->
我想,通常情况下,您不会在 View 中加载所有 Assets ,因为一些共享元素可能有很多,尤其是在较大的项目中。另外,我认为很高兴指出,我真的不想在 <body>
中为它们呈现样式。 , 所以创造 <links>
里面的景色对我来说不是一条路。这意味着像共享元素一样工作,您可以从中控制 Assets 的加载位置和加载的 Assets ,甚至不知道每个共享元素需要什么 Assets 。提前谢谢你。
最佳答案
Horizontal reuse ... is mainly used by projects that need to make template blocks reusable without using inheritance.
use
将外部文件合并到当前文件中,并可选择将 block 重命名为本地唯一值。然后可以使用 block
将这些本地唯一值注入(inject)到继承层次结构中。
例子。从基础“ parent ”开始:
<head>
{% block assets %}
<link rel='stylesheet' href='layout.css' />
{% endblock %}
</head>
<body>
<div id='layout' class='content'>
{% block content %}
{% endblock %}
</div>
</body>
定义菜单,我们稍后将“重用”的“组件”:
{% block assets %}
<link rel='stylesheet' href='menu.css' />
{% endblock %}
{% block content %}
<div id='menu' class='content'></div>
{% endblock %}
现在,将这两个放在一起。请注意我们如何扩展
-ing 基础,然后使用
-ing 组件并使用block
重用它的 block :
{% extends "layout.twig" %}
{% use "menu.twig" with assets as menu_assets, content as menu_content %}
{% block assets %}
{{ parent() }}
<link rel='stylesheet' href='view.css' />
{{ block('menu_assets') }}
{% endblock %}
{% block content %}
<div class='menu'>
{{ block('menu_content') }}
</div>
<div id='view' class='content'></div>
{% endblock %}
产量:
<head>
<link rel='stylesheet' href='layout.css' />
<link rel='stylesheet' href='view.css' />
<link rel='stylesheet' href='menu.css' />
</head>
<body>
<div id='layout' class='content'>
<div class='menu'>
<div id='menu' class='content'>
</div>
</div>
<div id='view' class='content'></div>
</div>
</body>
“定义具有相同名称的 block 并将它们全部合并”并不是很神奇,但它非常接近。您的布局不知道菜单,菜单也不知道布局:但它们都同意名为“ Assets ”和“内容”的 block 。然后 View 将它们拼接成正确的继承形式。
关于php - 使用 twig 创建即用型共享元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47435897/