질문있습니다!

NewsView에서 'FETCH_NEWS'와 같은 문자열을 props를 이용해 ListItem으로 넘기면서 구현하려고 하는데 계속

Uncaught TypeError: Object(...) is not a function 라는 에러가 발생합니다...

news 주소에서 처음부터 에러가 발생하는거인지 실행 자체가 안되서 개발자 도구에서 확인도 안되네요..

아래처럼 만들었는데 문법적으로 잘못된 부분이 있는건가요??

// NewsView.vue

<template>
  <list-item v-bind:FETCH="'FETCH_NEWS'" v-bind:items="news"></list-item>
</template>

<script>
import ListItem from  '../components/ListItem.vue';
import mapGetters from 'vuex';

export default {
    components: {
        ListItem
    },
    computed: {
        ...mapGetters({
            news: 'fetchedNews'
        })
    }
}
</script>

// ListItem.vue

<template>
  <div>
    <ul class="news-list">
        <li v-for="item in items" class="post" :key="item.title">
            
            <div class="points">
            {{ item.points }}
            </div>
            
            <div>
            <p class="news-title"><a v-bind:href="item.url">{{ item.title }}</a></p>
            <small class="link-text">
                {{ item.time_ago }}
                by
                <router-link :to="'/user/'+item.user" class="link-text">{{ item.user }}</router-link>
            </small>
            </div>
        </li>
    </ul>
  </div>
</template>

<script>
export default {
    created() {
        this.$store.dispatch(this.FETCH); 
    },
    props: {
        FETCH: String,
        items: Object
    }
}
</script>

한가지 질문이 더있는데,

ListItem에서 listItems를 data에서 선언하고 created에서 분기처리할 때, 같이넣어주지 않고 computed로 따로 구현하신 이유가 있으신건가요??

인프런 커뮤니티 질문&답변