Can't use data inside component

[visualcookie]

Hi,

I have the following component components/LastFm.vue with the following content:

<template>
    <ul>
        <li v-for="song in songs">
            {{ song.name }}
        </li>
    </ul>
</template>

<script>
import axios from 'axios'

const apiUrl = 'http://ws.audioscrobbler.com/2.0/?method=user.getrecenttracks'

export default {
    async data (context) {
        let { data } = await axios.get(apiUrl + '&user=visualcookie&limit=3&api_key=XXX&format=json')
        return { songs: data.recenttracks.track }
    }
}
</script>

But I get the following error from Vue:

[Vue warn]: data functions should return an object:
https://vuejs.org/v2/guide/components.html#data-Must-Be-a-Function 
(found in component <LastFm> at F:\work\github\v5\components\LastFm.vue)
warn @ vue.runtime.common.js:521
initData @ vue.runtime.common.js:3174
initState @ vue.runtime.common.js:3121
Vue._init @ vue.runtime.common.js:3378
VueComponent @ vue.runtime.common.js:3500
createComponentInstanceForVnode @ vue.runtime.common.js:1724
init @ vue.runtime.common.js:1734
hydrate @ vue.runtime.common.js:4496
hydrate @ vue.runtime.common.js:4512
hydrate @ vue.runtime.common.js:4512
hydrate @ vue.runtime.common.js:4512
hydrate @ vue.runtime.common.js:4512
patch @ vue.runtime.common.js:4585
Vue._update @ vue.runtime.common.js:2635
updateComponent @ vue.runtime.common.js:2609
get @ vue.runtime.common.js:2934
Watcher @ vue.runtime.common.js:2926
Vue._mount @ vue.runtime.common.js:2608
0.Vue$2.$mount @ vue.runtime.common.js:6178
init @ vue.runtime.common.js:1740
(anonymous) @ vue.runtime.common.js:1894
hydrate @ vue.runtime.common.js:4496
patch @ vue.runtime.common.js:4585
Vue._update @ vue.runtime.common.js:2635
updateComponent @ vue.runtime.common.js:2609
get @ vue.runtime.common.js:2934
Watcher @ vue.runtime.common.js:2926
Vue._mount @ vue.runtime.common.js:2608
0.Vue$2.$mount @ vue.runtime.common.js:6178
init @ vue.runtime.common.js:1740
hydrate @ vue.runtime.common.js:4496
hydrate @ vue.runtime.common.js:4512
patch @ vue.runtime.common.js:4585
Vue._update @ vue.runtime.common.js:2635
updateComponent @ vue.runtime.common.js:2609
get @ vue.runtime.common.js:2934
Watcher @ vue.runtime.common.js:2926
Vue._mount @ vue.runtime.common.js:2608
0.Vue$2.$mount @ vue.runtime.common.js:6178
init @ vue.runtime.common.js:1740
hydrate @ vue.runtime.common.js:4496
hydrate @ vue.runtime.common.js:4512
patch @ vue.runtime.common.js:4585
Vue._update @ vue.runtime.common.js:2635
updateComponent @ vue.runtime.common.js:2609
get @ vue.runtime.common.js:2934
Watcher @ vue.runtime.common.js:2926
Vue._mount @ vue.runtime.common.js:2608
0.Vue$2.$mount @ vue.runtime.common.js:6178
init @ vue.runtime.common.js:1740
hydrate @ vue.runtime.common.js:4496
hydrate @ vue.runtime.common.js:4512
patch @ vue.runtime.common.js:4585
Vue._update @ vue.runtime.common.js:2635
updateComponent @ vue.runtime.common.js:2609
get @ vue.runtime.common.js:2934
Watcher @ vue.runtime.common.js:2926
Vue._mount @ vue.runtime.common.js:2608
0.Vue$2.$mount @ vue.runtime.common.js:6178
mountApp @ client.js:322
(anonymous) @ client.js:344

vue.runtime.common.js:521 [Vue warn]: Property or method "songs" is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option. 
(found in component <LastFm> at F:\work\github\v5\components\LastFm.vue)

_{This question is available on Nuxt.js community (#c177)}

[visualcookie]

Duplicate of #32

[lock]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.