[vue] v-ons-card and v-ons-list not work I want

[hygjob]

I want to api data to show on v-ons-card or v-ons-list

but I met problem as below.

1. v-ons-card not showing anything
2. v-ons-list not scrollable

I use version as

• onsen ui version 2.10.8
• vue version 2.6.10
• vue-onsenui: 2.6.2

ex) v-ons-card - v-ons-card not showing anything.

<template>
<v-ons-page>
<p class=“intro”>
My Home List<br><br>
</p>

<!-- not show anything -->
<v-ons-card v-for=“photo in photos” :key=“photo.created_at”>

      <div class="title">{{ photo.name }}</div>
      <div class="content"></div>    
    </v-ons-card>

</v-ons-page>
</template>

…

data () {
return {
photos: [],
};
},

…

methods: {

getPhotos() {
  var vm = this;
  this.$http.get('http://localhost:8000/api/photos/',{

  })
  .then((response)=>{
    //console.log(response.data)
    vm.photos = response.data
  })
}

---

ex) v-ons-list not scrollable

<template>
<v-ons-page>
<p class=“intro”>
My Home List<br><br>
</p>

<v-ons-list  v-for="photo in photos" :key="photo.created_at">
  <v-ons-list-header>{{photo.created_at}}</v-ons-list-header>
  <v-ons-list-item>{{photo.name}}</v-ons-list-item>
  <v-ons-list-item>{{photo.text_content}}</v-ons-list-item>
</v-ons-list>

</v-ons-page>
</template>

…

data () {
return {
photos: [],
};
},
methods: {

getPhotos() {
  var vm = this;
  this.$http.get('http://localhost:8000/api/photos/',{

  })
  .then((response)=>{
    //console.log(response.data)
    vm.photos = response.data
  })
}

}