Javascript 带有Nuxt&；武装分子

我有一些问题，使阿凡达采摘工作

单击选择未被替换的头像后，出现错误TypeError:无法读取VueComponent上未定义的属性“src”。选择头像

我目前正在使用Vuetify和带有v-for的

v-avatar

组件来加载所有图像

你知道怎么做吗

HTML

---

谢谢你

问题在于你的selectAvatar方法中，你试图使用“this.avatar”，但它不存在。for循环中的化身不会传递给脚本。你应该这样做：

<v-img
  ...
  @click="selectAvatar(i)"
></v-img>

export default {
  layout: 'default',

  data() {
    return {
      selectAvatarDialog: false,
      avatars: [
        {src: require('@/assets/images/avatar-01.png') },
        { src: require('@/assets/images/avatar-02.png') },
        { src: require('@/assets/images/avatar-03.png') },
        { src: require('@/assets/images/avatar-04.png') },
        { src: require('@/assets/images/avatar-05.png') }
      ],
      selectedAvatar: require('@/assets/images/avatar-01.png'),
    }
  },
  methods: {
    selectAvatar(){
      this.selectedAvatar = this.avatar.src
      console.log('Avatar selected')
    }
  }
}

<v-img
  ...
  @click="selectAvatar(i)"
></v-img>

methods: {
    selectAvatar(i){
      this.selectedAvatar = this.avatars[i].src
      console.log('Avatar selected')
    }
  }