conditional-container icon indicating copy to clipboard operation
conditional-container copied to clipboard

Updated to work with Nova 4 and Vue 3

Open liam-simmons opened this issue 1 year ago • 3 comments

Main changes

Changed the way Vue knows when a field is updated. Previously it would watch it by accessing the parent component and then loop through its children to watch all of the relevent components. This no longer works in Vue 3 due to there no longer being one single "root" element. I replaced this with a custom Vue mixin: CheckableValues, which emits events whenever the field changes values using the Nova integrated Tinybus package.

I was also required to change the way that the Vue code was compiled, as well as some other package changes and updates.

There are also some very minor changes to the Php.

Notes

In field.js, I had to use a loop to repeatedly check if it's is the correct time to add the mixin to the conditional fields. There is almost certainly a better way to do this but this current method works regardless.

I have tested with most of the basic field types, but some of the more obscure and external fields might not work out of the box.

Resolves #78 @milewski Resolves #76 @dees040

liam-simmons avatar Aug 13 '22 13:08 liam-simmons

Hi @liam-simmons thanks for this PR!

I tried it out but it doesn't seem to be working for update... I spent some time trying to figure out what was wrong but no luck so far

For example, this is what I tried:

The name field is conditional...

image

Select::make('Option', 'option')
    ->options([
        1 => 'Option 1',
        2 => 'Option 2',
        3 => 'Option 3',
    ]),

ConditionalContainer::make([
    Text::make('Name', 'name')
        ->rules('required', 'max:255')
])->if('option = 1'),

Textarea::make('Description', 'content->description'),

However, when submitting the form, the name field is not included on the payload..

image

milewski avatar Aug 15 '22 07:08 milewski

This feature is now built-in to Nova 4 no ?

https://nova.laravel.com/docs/4.0/resources/fields.html#dependent-fields

vesper8 avatar Dec 21 '22 13:12 vesper8

@vesper8 nova version works a bit differently from this package... I think the DX of this package was better and I found the nova dependsOn not working for me with some third-party packages...

milewski avatar Dec 21 '22 15:12 milewski