我正在尝试制作包含其所需的VueJs依赖项的完整刀片组件
视图/共享/_manage-user-button.blade.php
<button
@click.prevent="$modal.show('manage-user-modal', {
url: '{{ route('users.update', $user) }}'
})"
>
Manage {{ $user->name }}
</button>
<manage-user-modal>
</manage-user-modal>
但是,每次我重新调用此组件时,<manage-user-modal>
将重新呈现。
一种解决方案是将<manage-user-modal>
移至父级或全局,但这会打破使部分独立的想法。
@if(!isset($loop) ?: $loop->last)
<manage-user-modal>
</manage-user-modal>
@endif
有了它,它就像一个魅力 BUT 一样工作,当在同一页面上的两个不同的for-loop / places中调用该组件时,它仍将呈现两次。
我还尝试了一种“ hacky”方式
@if(config('manage-user-button-rendered')? false : config(['manage-user-button-rendered' => true]) )
<manage-user-modal>
</manage-user-modal>
@endif
但是似乎无法在视图上工作
答案 0 :(得分:0)
对不起,这是一个愚蠢的错误...
config(['manage-user-button-rendered' => true]
返回null
所以我添加了!
以返回true
[edit]
我找到的最优化的方法是使用define
,并将其与自定义刀片指令结合使用。
Blade::if('renderOnce', function ($key) {
return defined($key)? false : define($key, true);
});
然后
@renderOnce('manage-user-modal')
<manage-user-modal>
</manage-user-modal>
@endrenderOnce
尽管如此,我仍然愿意接受更好和更少hacky的解决方案。
答案 1 :(得分:0)
我将全局定义模式:
index.blade
<manage-user-modal>
</manage-user-modal>
要保持局部独立,请将模态名称作为变量传递给它们:
index.blade
@include('partial',['user_modal' => 'manage-user-modal'])
partial.blade
<button
@click.prevent="$modal.show($user_modal, {
url: '{{ route('users.update', $user) }}'
})"
>
Manage {{ $user->name }}
</button>