spiral / app

Spiral Framework Skeleton HTTP Application: Queue, Console, Cycle ORM
https://spiral.dev/
MIT License
191 stars 20 forks source link

Cannot use partial stempler file in base layout #20

Closed sujit-baniya closed 4 years ago

sujit-baniya commented 4 years ago

I defined partial components (header.dark.php, footer.dark.php) under layout/partial/.

Then on base.dark.php I used following code

<block:header/>
<block:content>
    <use:element path="layout/partial/left-sidebar"/>
        <block:body/>
    <use:element path="layout/partial/right-sidebar"/>
    <use:element path="layout/partial/footer"/>
</block:content>
<block:footer/>

But it doesn't seem to render those partial files.

In each partial files I add some random text

wolfy-j commented 4 years ago

You just imported element, make sure to actually load it using element name.

Use is like PHP “use”.

wolfy-j commented 4 years ago

Check the sample project; homepage have an example

sujit-baniya commented 4 years ago

I see that use:element is being used in extended file: https://github.com/spiral/app/blob/master/app/views/home.dark.php

I want to use the partial element in the base layout so that I do not need to define it on other files. For that I did following:

<use:element path="partial/header" as="partial:header"/>
<block:header>
    <partial:header/>
</block:header>

and not working. Am I missing something? The base.dark.php reads:

<!DOCTYPE html>
<html lang="@{locale}">
<head>
    <title>${title}</title>
    <block:head>
        <link rel="stylesheet" href="/css/vendor.css">
        <link rel="stylesheet" href="/css/app.css">
        <stack:collect name="styles" level="2"/>
    </block:head>
</head>
<body>
<use:element path="partial/header" as="partial:header"/>
<block:header>
    <partial:header/>
</block:header>
<block:content>
    <block:body/>
</block:content>
<block:footer/>
<script src="/js/manifest.js"></script>
<script src="/js/vendor.js"></script>
<script src="/js/app.js"></script>
<stack:collect name="scripts" level="1"/>
</body>
<hidden>${context}</hidden>
</html>
sujit-baniya commented 4 years ago

Actually I got it working by using this:

<use:element path="partial/header"/>
<use:element path="partial/footer"/>
<block:header>
    <header/>
</block:header>
<block:content>
    <block:body/>
</block:content>
<block:footer>
    <footer/>
</block:footer>