vue.js - Child-Parent-Communication：找不到方法？

Question

我正在尝试使用 nuxtjs 设置子父通信。这是我的孩子：

    <div>
        <b-nav-item @click="clicked" :class="{active: active}">{{item.name}}</b-nav-item>
    </div>
</template>

<script>
    export default {
        props: {
            item:{
                required: true
            },
            active:{
                type: Boolean,
                default: false
            }
        },
        methods: {
            clicked() {             
                this.$emit('clicki');
            }
        },
    }
</script>

家长：

    <NavigationElement v-for="item in clients" :key="item.id" :item="item" @clicki="showClient" :active="currentClient._id==item._id"><NavigationElement>
</template>
<script>
    import NavigationElement from '~/components/NavigationElement.vue'
    import TopicElement from '~/components/TopicElement.vue'
    export default {
        middleware: ['check-auth', 'auth'],
        computed: {clients() {return this.$store.getters.getClients}},
        methods(){
            showClient(){
                console.log("click");
            // this.currentClient = client;
            }
        },
</script>

我收到此错误：

属性或方法“showClient”未在实例上定义，但在渲染期间被引用。通过初始化该属性，确保该属性是反应性的，无论是在数据选项中，还是对于基于类的组件。请参阅：https ://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties 。

有人可以帮助我并解释为什么我得到它吗？

标签： vue.jsnuxt.js

Answer 1

</template>
<script>
   import NavigationElement from '~/components/NavigationElement.vue'
   import TopicElement from '~/components/TopicElement.vue'
   export default {
       middleware: ['check-auth', 'auth'],
       computed: {clients() {return this.$store.getters.getClients}},
       methods:{
           showClient(){
               console.log("click");
           // this.currentClient = client;
           }
       },
</script>

方法必须是对象而不是函数。