Undefined variable: _instance

#1

I’m trying to create a FilePond component. I’ve got as far as the code below.

<div
    x-data
    x-init="
    FilePond.setOptions({
        server: {
            process: (fieldName, file, metadata, load, error, progress, abort, transfer, options) => {
                @this.upload('attachment', file, load, error, progress)
            },
        },
    });

    FilePond.create( $refs.input )
    "

    wire:ignore
>
    <input type="file" x-ref="input">
</div>


@push('styles')
    <link href="https://unpkg.com/filepond/dist/filepond.css" rel="stylesheet">
@endpush

@push('scripts')
    <script src="https://unpkg.com/filepond/dist/filepond.js"></script>
@endpush

When displaying the view, the following error is generated:

ErrorException

Undefined variable: _instance (View: /Users/simon/Act/mts-nova/resources/views/components/input/filepond.blade.php) (View: /Users/simon/Act/mts-nova/resources/views/components/input/filepond.blade.php)

Are you using the latest version of Livewire: Yes

Any help or suggestions would be much appreciated.

#2

Did you ever figure this issue out? I’m experiencing the same issue.

#3

Unfortunately, I have still not been able to resolve this.

Simon

#4

I’m having the same issue, did you fix it?

#5

Has anyone done it yet?

#6

You can only access livewire properties from within a livewire component. Make sure the component in question is a livewire component itself, or is at least nested within one.

In my case, the error was thrown by an abstracted component used in livewire components, as well as regular blade templates. To get around this issue, I used blade @if directives to return a blade-safe version of the component if $attributes->wire('model')->value is falsey. You may be able to adapt this to suit your situation.