Saving multiple data dynamic form in Laravel 5.1 and Vue JS

I have to add/post data form. But the form dynamically can increase as user 'click' on a button. I've already browse about it and there some answer i get like using $request->all() to fetch all data from input forms.

And then my problem is, my app using VueJS as front-end. Is there any some configuration on VueJS script to post all data from that dynamic form??

My Blade template that will be increase dynamically:

<div id="form-message">
{!! Form::text('rows[0][DestinationNumber]', null, [
    'id' => 'recipient',
    'class' => 'form-control',
    'v-model' => 'newMessage.DestinationNumber'
    ])
!!}
{!! Form::textarea('rows[0][TextDecoded]', null, [
    'rows' => '3',
    'id' => 'recipient',
    'class' => 'form-control',
    'v-model' => 'newMessage.TextDecoded'
    ]) 
!!}
</div>

That zero number will increase depends on how much user click add button. And then here my VueJS script

var newSingleMessage = new Vue({
el: '#newsinglemsg',
data: {
    newMessage: {
        DestinationNumber: '',
        TextDecoded: ''
    },
},
methods: {
    onSubmitForm: function(e) {
        e.preventDefault();
        var message = this.newMessage;

        this.$http.post('api/outbox', message);
        message = { DestinationNumber: '', TextDecoded: '' };
        this.submitted = true;
    }
}

});

On laravel controller, i have simple logic to test result how data passed.

$input = $request->all();
$output = dd($input);
return $output;

And, I test it using 2 additional form. So, the data should be 3 rows. The result (checked from FireBug) to be like this

{"DestinationNumber":"1234567890","TextDecoded":"qwertyuio"}

Data passed just one, and then the type is JSON. Even I use return $output->toArray(), type still JSON.

Oh yeah, once more. Idk how to make the zero number increase dynamically using javascript. When testing, i just manual add the form. Here my add click function javascript

var i = 0,
clone = $('#form-message').clone(),
recipient = document.getElementById('recipient');
recipient.setAttribute('name', 'rows['+ i +'][DestinationNumber]');
clone.appendTo('.form-message:last');
i++;

For second and next rows, name attribute not added on the input elements. Thanks

via Chebli Mohamed