问将数组从视图Laravel加载到Vue组件

EN

     <!-- Laravel SELECT Element -->

     <div class="form-group">
         <label for="customer">Client</label>
               <select 
                      name="customer"
                      class="form-control @error('customer')
                          is-invalid
                      @enderror"
                      id="customer">
                            <option value="">-- Seleciona -</option>
                                 @foreach($customers as $customer)
                                      <option 
                                            value="{{ $customer->id }}" 
                                            {{ old('customer') == $customer->id ? 'selected' : '' }}>{{ $customer->customer_name }}</option>
                                 @endforeach
               </select>
               
               @error('customer')
                     <span class="invalid-feedback d-block" role="alert">
                           <strong>{{$message}}</strong>
                     </span>
               @enderror
    </div>
    
    <!-- End Laravel SELECT Element -->



    <!-- Vue Component SELECT Element -->

    <create-task-jobs v-bind:customers={{ json_encode($customers) }}>
                            
    </create-task-jobs>

    <!-- End Vue Component SELECT Element -->

<template>
  <div>
    <form @submit.prevent="agregar">
      <h3>Afegir Tasques</h3>
            <b-form-group id="input-group-3" label="Client" label-for="input-3">
                <b-form-select
                id="input-3"
                v-model="form.customer"
                :options="customers_load"
                required
                ></b-form-select>

            </b-form-group>

      <button class="btn btn-primary" type="submit">Agregar</button>
      
    </form>
  </div>

  
</template>

<script>
  export default {
    props: {
      customers: Array
    },
    data() {
      return {
        form: {
          customer: null,
        },
        customers_load: [{ text: 'Select One', value: null },...this.customers]
      }
    }
  }
</script>