酶计算的错误-TypeError:无法读取未定义的属性“ find”

时间:2019-02-16 04:34:04

标签: vue.js

有错误

Vue警告]:渲染错误:“ TypeError:无法读取未定义的属性'find'”

当我测试vue组​​件时。我尝试了不同的方法,但仍然出现未定义的错误。当我加载所有聚会时,它工作正常。但是当我想获得信号事件时出现问题

store.js

state: {
    loadMeetups :[
        { 
            imageUrl: 'https://upload.wikimedia.org/wikipedia/commons/4/47/New_york_times_square-terabass.jpg', 
            id: 'afajfjadjaaadja323',
             title: 'Meetup in New York' ,
             date:'2018-07-17'

        },
        { 
            imageUrl: 'https://upload.wikimedia.org/wikipedia/commons/1/14/Palais_de_Justice_%28Paris%29_June_2010.jpg', 
            id: 'aadsfhbkhlk1241',
             title: 'Meetup in Paris',
             date:'2018-07-19'
        }
    ],
    user: {
        id: 'afajfjadjaaadja323',
        registeredMeetups: ['aadsfhbkhlk1241']
    }
}

Meeetup.vue

<template>
    <v-container>
        <v-layout row wrap="">
            <v-flex xs12>
              <v-card>
                  <v-card-title>
                      <h3 class="primary--text">{{ meetup.id }}</h3>
                  </v-card-title>
                  <v-card-media
                     src="https://upload.wikimedia.org/wikipedia/commons/4/47/New_york_times_square-terabass.jpg"
                                 height="400px"
                  >

                  </v-card-media>
                  <v-card-text>
                      <div class="info--text">17th July 2017 - Where it takes place</div>
                      <div>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</div>
                  </v-card-text>
                  <v-card-actions>
                      <v-spacer></v-spacer>
                      <v-btn class="red darken-1" dark="">Register</v-btn>
                  </v-card-actions>
              </v-card>
            </v-flex>
        </v-layout>
    </v-container>
</template>
<script>
export default {
    props: {
    id:String
  },
    computed:{
        meetup(){
            return this.$store.getters.loadedMeetup(this.id)
        }
    }
}
</script>

1 个答案:

答案 0 :(得分:0)

方法必须使用吸气剂。因此,一旦定义了吸气剂,就可以在this.$store.getters下的项目中使用它的任何组件。这在正确的语法下正常工作!!

https://vuex.vuejs.org/guide/getters.html

loadedMeetup: state => (id) => {
        return state.loadedMeetups.find(meetup => meetup.id === id)
      }