从Vuex中的数组中删除特定项

时间:2016-08-12 15:41:46

标签: javascript arrays vue.js vue-component vuex

我还在学习vue.js,并在一个小项目的中间帮助我学习更多关于使用Vuex创建更大规模的应用程序。

我遇到了一个问题,我正在尝试使用应用中的按钮从数组中删除特定项目;我似乎无法在Vuex中获得正确的语法。以下是我正在使用的内容:

商品

const state = {
    sets: [{}]
}

export const addSet = function ({ dispatch, state }) {
    dispatch('ADD_SET')
}

const mutations = {
    ADD_SET (state) {
        state.sets.push({})
    },
    REMOVE_SET (state, set) {
        state.sets.$remove(set)
    }
} 

操作

export const removeSet = function({ dispatch }, set) {
    dispatch('REMOVE_SET')
}

吸气剂

export function getSet (state) {
    return state.sets
}

应用

<div v-for="set in sets"> 
    <span @click="removeSet">x</span>
    <Single></Single>
</div>

我有一个操作设置,会在数组中添加一个空白项目,当您点击add item按钮时会在应用中放置一个新组件,但不确定如何添加remove item按钮到每个组件并有这个工作。

我希望这是有道理的!

0 个答案:

没有答案