Laravel vue cannot access to relation data

I have customer data which has hasOne relationship with address table. Returned data format is like below.

{
  "customer_id": 1,
  "last_name": "Cruickshank",
  "first_name": "Pearl",
  "phone": "+4 921-008-8344",
  "email": "[email protected]",
  "order_id": null,
  "address_id": 66,
  "created_at": "2017-01-18 06:24:40",
  "updated_at": "2017-01-18 06:24:40",
  "deleted_at": null,
  "address": {
    "address_id": 1,
    "address_code": "RS-03549-9811",
    "address1": "14978 Effertz Turnpike Apt. 086",
    "address2": null,
    "city": "Susanaburgh",
    "province": "Illinois",
    "country": "PG",
    "postal_code": "03549-9811",
    "created_at": "2017-01-18 06:24:40",
    "updated_at": "2017-01-18 06:24:40"
  }

I got data using return $this->model->with(implode(',', $relation))->get();

However, I cannot access any of data in address object.

Vue Code I throw city is undefined. However, I can access to address object data using chrome developer tool

<tr v-for="(customer, index) in customers">
     <td>{{index + 1}}</td>
     <td>{{getFullName(customer.first_name, customer.last_name)}}</td>
     <td>{{customer.phone}}</td>
     <td>{{customer.address.city}}</td>
</tr>

Am I doing something wrong? I tried customer['address']['city'] as well.

I can access city when I get data as you see below.

getCustomerList () {
    axios.get('/api/customers')
       .then((res)=>{
          if(res.status === 200){
            //I can access city here but not in vue for loop ...
            console.log(res.data.customers[0].address.city)
            this.customers = res.data.customers
        }
    })
 },