如何解决Livewire如何设置jetstream对话框模式的宽度?
我正在使用Jet-Stream的对话框模式,它工作得很好,但我不知道如何确定其宽度。
以下是我的使用方式。
<x-dialog-modal wire:model="show_equipment_dialog" :maxWidth="'100%'">
<x-slot name="title"> {{ __('Equipment Dialog') }}</x-slot>
<x-slot name="content">
@livewire('equipment-lw',['usage' => 'chooser'])
</x-slot>
<x-slot name="footer">
<x-secondary-button wire:click="closeEquipmentDialog">{{ __('Close the dialog') }}</x-secondary-button>
</x-slot>
</x-dialog-modal>
在对话框模式下使用此功能
@props(['id' => null,'maxWidth' => null,'usage'=>'database'])
<x-jet-modal :id="$id" :maxWidth="$maxWidth" {{ $attributes }}>
<div class=" px-6 py-4">
<div class="text-lg">
{{ $title }}{{$maxWidth}}
</div>
<div class="mt-4">
{{ $content }}
</div>
</div>
<div class="px-6 py-4 bg-gray-100 text-right">
{{ $footer }}
</div>
maxWidth传递给对话框模态(由于内容槽中的{{$ maxWidth}},我可以看到它),但是对xjet模态没有影响。正确的语法是什么?
谢谢您的帮助。
解决方法
您可以在vendor / jetstream / components“ modal.blade.php”中设置模态的maxWidth,然后找到maxWidth的switch语句
,在您的模态中添加 maxWidth="size-you-want"。 可用大小在 resources\views\vendor\jetstream\components\modal.blade.php 中,但您可以添加更多。那些默认是 sm,md,lg,xl,2xl
<x-dialog-modal wire:model="show_equipment_dialog" maxWidth="md">
<x-slot name="title"> {{ __('Equipment Dialog') }}</x-slot>
<x-slot name="content">
@livewire('equipment-lw',['usage' => 'chooser'])
</x-slot>
<x-slot name="footer">
<x-secondary-button wire:click="closeEquipmentDialog">{{ __('Close the dialog') }}</x-secondary-button>
</x-slot>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。