Livewire的飞秒调整
Livewire的飞秒调整
提问于 2022-01-06 20:23:46
如果我做到了这一点，我会诚实地浏览并尝试每一个可能的例子。我的另一个选择是使用干预，但是如果这是文件池中的一个选项，它应该可以工作。
我真的需要一副新的眼光，因为我可能错过了什么。
问题
问题是文件没有按调整大小保存。它们仍然保存为完全大小的上传。我试图将所有图像的大小调整到600x600，但是当我加载一个2mb文件1600x1000时，它不会调整大小。文件保存，但以原始格式。
问题2，这是一个新的，第一个上传的图像将灾难从预览，但如果我保存它将保存它。这一次我都快疯了。
我的刀锋档案
<x-filepond wire:model="photos" multiple/> FilePond组件
<div
wire:ignore
x-data=""
x-cloack
x-init="
FilePond.registerPlugin(FilePondPluginImagePreview , FilePondPluginImageResize);
allowMultiple: {{ isset($attributes['multiple']) ? 'true' : 'false' }},
FilePond.setOptions({
server: {
process:(fieldName, file, metadata, load, error, progress, abort, transfer, options) =>{
@this.upload('{{ $attributes['wire:model']}}', file, load, error, progress)
},
revert: (filename, load) => {
@this.removeUpload('{{ $attributes['wire:model'] }}', filename, load)
},
},
});
const pond = FilePond.create($refs.input,{
acceptedFileTypes: ['image/png', 'image/jpeg', 'image/jeg'],
imagePreviewHeight: 270,
allowImageResize: true,
imageResizeTargetWidth: 600,
imageResizeTargetHeight: 600,
imageResizeMode: 'contain',
imageResizeUpscale: 'false',
});
this.addEventListener('pondReset', e => {
pond.removeFiles();
});
"
>
<input type="file" x-ref="input">带电元件
public $photos = [];
....
if($this->photos){
foreach ($this->photos as $photo) {
$storedImageUrl = $photo->store('photos');
$photos = new Images;
$photos->url = $storedImageUrl;
$photos->post_id = $post->id;
$photos->save();
}
}回答 1
Stack Overflow用户
回答已采纳
发布于 2022-01-10 10:38:56
您必须注册图像转换插件，以应用更改。
调整大小插件只计算所需的大小更改。这是一个单独的插件，因为有些开发人员希望在服务器上应用更改。
<div wire:ignore
x-data=""
x-cloack
x-init="FilePond.registerPlugin(
FilePondPluginImagePreview,
FilePondPluginImageResize,
FilePondPluginImageTransform <--
);页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/70613210
复制相关文章
相似问题
腾讯云开发者
