vue.js - 有没有办法从数据部分内的方法部分创建函数引用

Question

我有一个带有列表的 Vue 组件

<v-list-item
        v-for="(item, i) in items"
        :key="i"
>
    <v-list-item-content>
        <v-list-item-title @click="item.onClick"></v-list-item-title>
    </v-list-item-content>
</v-list-item>

我在methods:部分中创建了方法

methods:{
        openProjects(){
            if (!this.loggedIn) {
                this.$router.push('/projects');
            }
        },
        logout(){
            this.$store.dispatch('auth/logout')
            if (!this.loggedIn) {
                this.$router.push('/');
            }
        },
    },

现在我想将它们与data

data: () => ({
        items: [
            { onClick: openProjects },
            { onClick: logout},
        ],
    }),

当然，Vue 上下文看methods不到data. 那么链接它们的方法是什么？

标签： vue.js

Answer 1

转过为什么不使用带参数的方法

<v-list-item v-for="(item, i) in items" :key="i">
    <v-list-item-content>
        <v-list-item-title @click="handleItem(item)"></v-list-item-title>
    </v-list-item-content>
</v-list-item>


methods:{
    handleItem(item) {
       this.openProjects(item)
       this.logout()
    }
    openProjects(item){
        // Some logic with item
    },
    logout(){
        // Some logic
    },