twill icon indicating copy to clipboard operation
twill copied to clipboard

Custom Vue.js component outside of a form

Open alitak opened this issue 3 years ago • 2 comments

Summary

I have to create a custom Vue.js component which will handle the whole form, data processing. If I create a component now, it only works within the contentFields.

Describe the solution you'd like

It would be nice, if it worked within a customPageContent, like this: `@extends('twill::layouts.free')

@section('customPageContent')

@stop It would be still acceptable solution if I had to insert some extra js including, like this:@push('extra_js_head') @if(app()->isProduction()) @endif @endpush`

alitak avatar Sep 16 '22 10:09 alitak

A solution for this was provided by @pboivin on Discord for another developer in the past:

You can copy this file into your project: https://github.com/area17/twill/blob/2.x/views/layouts/free.blade.php in resources/views/admin/layouts/free.blade.php Edit lines 7 and 31 to load main-form.js instead of main-free.js. This will ensure that your custom components are loaded in your custom page. Then, you can extend your custom layout instead of twill::layouts.free :

@extends('admin.layouts.free')

@section('customPageContent')
   <a17-hello-world name="World"></a17-hello-world>
@stop

ifox avatar Sep 16 '22 10:09 ifox

We should however address this by loading custom components in the build for free pages.

ifox avatar Sep 16 '22 10:09 ifox