Integration LiveWire with MediaLibrary

[pishguy]

how can we upload image with the this library and Laravel Livewire?

we don't use Media library pro and how can do that without it? it means using not pro version

[sanderdewijs]

Not sure if it's the most clean way to do it, but I created an $images = [] property on the Livewire component.

Each upload action on the Livewire component adds an image to this array. For actually storing the images, I created a save method. So the user uploads the images first, then clicks save to store the images.

The save method has 2 steps. First you store each image via the $this->storeAs('/', 'filename', 'diskName') method which is part of the WithFileUploads trait that Livewire uses to store files. Next, you use the $model->addMediaFromDisk('filename', 'diskName')->toMediaCollection('yourMediaCollection', 'diskName') to add the images to the desired mediacollection and move them to the disk/storagelocation of your choice.

In simplified code it looks like this:

class Picturemanager extends Component
{
    use WithFileUploads;
    public $pictures = [];
   
    public function save() {
        foreach ($this->pictures as $picture) {
            $picture->storeAs('/', str_replace($picture, $picture->extension(), $picture->getClientOriginalName()), 'myDisk');
            $myModel->addMediaFromDisk($picture->getClientOriginalName(), 'myDisk')->toMediaCollection('photos', 'myDisk');
        }

        $this->pictures = [];
    }
}

[shokouhi70]

$model->addMedia($this->photo->path())
            ->toMediaCollection();