나뭇 가지를 사용하여 바로 사용할 수있는 공유 요소 만들기

나는 많은 공유 요소가있는 프로젝트에서 작업 중입니다. 꼬리말, 머리말, 내비게이션 등. 필자는 필자가보기에 확장 한 레이아웃이 거의 없다. 지금은 공유 요소를 내 뷰에서로드하고 있지만로드 할 뷰 내부의 각 공유 요소에 필요한 모든 애셋 (종속성)을 제공해야합니다. 그 단계를 건너 뛰고 즉시 사용을 위해 준비 될 요소를로드 할 수 있기를 바란다. (그래서 일부 자바 스크립트와 CSS 파일을 기억할 필요가 없을 것이다. .나뭇 가지를 사용하여 바로 사용할 수있는 공유 요소 만들기

요소보기에서 공유 요소에 필요한 모든 에셋을 지정하려고 했으므로 필요로하는 요소를 포함 할 때 내 뷰 내에 모든 요소를 지정하지 않고도 "자동으로"자산을로드합니다. 그래서 제 질문은 이것이 가능하거나 이것이 성취 할 수있는 올바른 방법일까요?

구조 :

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 -->

일반적으로 일부 공유 요소에는 많은 프로젝트가 포함될 수 있으므로보기에는 모든 자산을로드하지 않는 것으로 보입니다. 또한 <body> 안에 스타일을 렌더링하고 싶지 않으므로보기 안에 <links>을 만들면 나에게 갈 방법이 아님을 지적하는 것이 좋습니다. 이것은 공유 요소처럼 작동하기 때문에, 공유 요소마다 필요한 자산을 모르고조차도 자산을로드 할 위치와로드 할 자산을 제어 할 수 있습니다. 미리 감사드립니다. documentation on use에서

출처

2017-11-22 Dawid Zbiński

안녕하세요, 스타일 시트와 자바 스크립트 블록을 별도로 사용해 보셨습니까? –

나는 그것이 무엇을 의미하는지 모르겠습니다. 나는 그것들을 분리한다. 공유 요소에 관해서라면, 스크립트는 대부분 그 공유 요소의 뷰의 끝 부분에있다. (괜찮 았지만 몸의 끝에서 그것들을 가지고 싶다.) 그리고 스타일 시트는 뷰에서로드된다. 자체적으로 (나를보기에 문제가되고 싶다. 내가보기에 그들을 쓰고 머리 속에 넣을 수 있기를 원한다.) –

모범 사례는 심포니 문서에 설명되어있다 : https://symfony.com/doc /3.4/templating.html#including-stylesheets-and-javascripts-in-twig –

수평 재사용은 ... 주로 상속을 사용하지 않고 템플릿 블록을 재사용 할 필요가 프로젝트에 의해 사용된다.

use은 현재 파일에 외부 파일을 통합하며 블록의 이름을 로컬 고유 값으로 바꿀 수 있습니다. 그런 다음 로컬로 고유 한 값을 block을 사용하여 상속 계층에 삽입 할 수 있습니다.

예. 기본 "부모"로 시작

<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 %}

함께 그 두 가지를 가져온다.

{% 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와의 블록 구성 요소를 -ing 및 재사용 extends 기반을 -ing,하지만 use 얼마나 주목 같은 이름과 그들 모두가 합쳐집니다. "하지만 꽤 가깝습니다. 레이아웃은 메뉴에 대해 알지 못하며 메뉴는 레이아웃에 대해 알지 못합니다. 그러나 둘 모두 "자산"및 "컨텐츠"라는 블록에 동의합니다. 그런 다음 뷰는이를 함께 상속하여 올바른 상속 양식을 만듭니다.

출처

2017-11-29 19:33:47 bishop

위대한 분, 고마워요. 나는 문서를 읽는 동안 아마 맹인이었다. –

나뭇 가지를 사용하여 바로 사용할 수있는 공유 요소 만들기

답변

관련 문제