如何在匿名Laravel组件中编写CSS?

ltskdhd1  于 7个月前  发布在  其他
关注(0)|答案(1)|浏览(77)

我不想在每个组件中保留特定于组件的样式(如Vue SFC)。它看起来像这样:

<!-- base-button.blade.php -->
<button class="btn">
  {{ $slot }}
</button>

<style>
  .btn { /* Some styles */ }
</style>

字符串
如果我粘贴上面的代码,style标签将从呈现的HTML中删除。

我尝试了分段

{{-- layout.blade.php --}}
@hasSection('style')
  @yield('style')
@endif

{{-- base-button.blade.php --}}
@section('style')
  <style>
    .btn {
      /* Some styles */
    }
  </style>
@endsection

我试了stacks

{{-- layout.blade.php --}}
@stack('styles')

{{-- base-button.blade.php --}}
@push('styles')
  <style>
    .btn {
      /* Some styles */
    }
  </style>
@endpush


但是它们都没有呈现任何style标记。

piwo6bdm

piwo6bdm1#

使用@push指令将样式推入名为“styles”的堆栈。

<!-- components/base-button.blade.php -->
<button class="btn">
  {{ $slot }}
</button>

@push('styles')
  <style>
    .btn {
      /* Some styles */
    }
  </style>
@endpush

字符串
使用@stack指令呈现推送的样式。

<!DOCTYPE html>
<html>
<head>
  <title>Laravel</title>
  @stack('styles')
</head>
<body>
  <!-- Your content here -->
</body>
</html>

相关问题