如何解决添加更多图像输入文件
我几天来一直在研究如何在没有结果的情况下改进图像加载功能。
问题:
- 通过创建多张图片上传按钮,用户可以选择任意数量的图片。为了将该过程限制为只能上传 30 张图片,我使用了 max: 30 并且它似乎工作正常。
如果用户再次单击该按钮,它会将加载的图像替换为所选的新图像。 因此,我尝试创建一个允许添加更多图像的功能:
我的意见:
<input wire:model="imagenes" type="file" name="imagenes" accept="image/*" class="form-control-file" multiple>
添加更多图片功能:
<button class="text-white btn btn-info btn-sm" wire:click.prevent="add({{$i}})">
Agregar más fotos
</button>
@foreach($inputs as $key => $value)
<input wire:model="name.{{ $value }}" type="file" name="imagenes" accept="image/*" class="form-control-file">
@endforeach
我需要的是能够验证在视图中的两个输入之间上传的图像不超过 30 张。
验证:
$this->validate([
'imagenes' => 'max:30',]);
他们可以给我更多的光来完成这个功能。非常感谢
解决方法
这有帮助吗? 它不允许超过 30 个输入。 虽然我真的建议您也检查 Livewire 组件中的图像总数,因为用户可以轻松添加更多输入。
$c = 0;
@foreach($inputs as $key => $value)
@php if ($c++ > 30) @break @endphp
<input wire:model="name.{{ $value }}" type="file" name="imagenes" accept="image/*" class="form-control-file">
@endforeach
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。