@this.set does not access array variable

#1

How can I make javascript access to php variable
in Component

public $content ;

in component view


<script src="https://cdn.ckeditor.com/4.14.0/standard/ckeditor.js"></script>

<div  wire:ignore class="col-sm-10">
        <textarea class="w-full " 
        wire:ignore
        wire:model.debounce.999999s="content" id="content"> </textarea>
</div>

<script>
    CKEDITOR.replace('content').on('change', function(e){
        @this.set('content', e.editor.getData());
    });
</script>

it works good.

but I want array for form .

The following is not working .

I guess @this.set can not access array variable.

in Component

    public $form = [
        'content'=> null,
    ];

in view .


<script src="https://cdn.ckeditor.com/4.14.0/standard/ckeditor.js"></script>

<div  wire:ignore class="col-sm-10">
        <textarea class="w-full " 
        wire:ignore
        wire:model.debounce.999999s="form.content" id="content"> </textarea>
</div>

<script>
    CKEDITOR.replace('content').on('change', function(e){
        @this.set('form.content', e.editor.getData());
    });
</script>

How can I use @this.set(‘form.content’, ) … ?

#2

I’ve tried a rudimentary example and was able to use @this.set to set a value to an array.

Component.php

public $myA = [
    'test' => 1,
    'test2' => 2
];

component.blade.php
<div>
    {{ $myA['test'] }}
    <button @click="@this.set('myA.test', Math.random());">test</button>
</div>

You may think about having your model at the div level of your editor code. Events will bubble up and be picked up. This could simplify things for you.