README

Blade Snip

Blade Snip 允许您多次使用 blade 模板的部分。基本上是部分，但内联。

<div class="products">
    @snip('product', ['image' => null])
        <div class="product">
            @if ($image)
                <img src="{{ $image }}">
            @endif
            <h1>Lorem Ipsum Dolor</h1>
            <p>£{{ number_format($price ?? rand(10, 100)) }}</p>
            <button>Add to Basket</button>
        </div>
    @endsnip
    @stick('product')
    @stick('product', ['image' => 'cheese.jpg'])
    @stick('product', ['image' => 'potato.jpg', 'price' => 120])
    {{-- or --}}
    @spread('product', 3)
</div>

@snip('content')
    <x-figure caption="Lorem ipsum dolor sit amet">
        <img src="photo.jpg">
    </x-figure>
@endsnip
@if ($link)
    <a href="{{ $link }}">@stick('content')</a>
@else
    @stick('content')
@endif

@snip('complex_thing')
    ...
@endsnip
<div class="mobile">
    <h2>{{ $name }}</div>
    <p>{{ $location }}</div>
    <div>@stick('complex_thing')</div>    
</div>
<table class="desktop">
    <tr>
        <th>{{ $name }}</td>
        <td>{{ $location }}</td>
        <td>@stick('complex_thing')</td>
    </tr>
</table>

为什么？

我创建这个是为了在原型设计页面布局时使用。拥有可重复使用的块很有用，但我不想在多个文件之间跳转，或者还不知道这些文件应该如何结构化。

这主要是作为开发工具而设计的，一旦完成原型设计，通常最好将内容分解为实际的局部或组件。也就是说，还有其他潜在的使用场景。

安装

在项目根目录中运行以下命令

composer require jacksleight/blade-snip

用法

查看上面的示例。

指令接受以下参数

• @snip(string $name, ?array $defaults = []) … @endsnip
  • 定义一个新的 snip
• @stick(string $name, ?array $data = [])
  • 包含一个 snip
• @spread(string $name, int $count || array $datas)
  • 多次包含一个 snip
  • 还向每个迭代添加一个 $index 变量

在底层，@snip 和 @endsnip 指令只是在闭包中包装那段代码，然后 @stick 和 @spread 调用它。由于它们是闭包，它们有它们自己的变量作用域，但包含模板中定义的变量。名称只能包含字母数字字符和下划线。