我试图创建一个简单的待办事项应用程序,用户应该能够创建具有自己的待办事项集合的项目 . 然后将每个项目的待办事项分类为 initial , WIP 和 finished . 可通过路径 projects/:id 查看项目,其中 id 是项目的ID . 我在每个项目的Vuex商店中的结构如下:

{

title: "Lorem ipsum",

description: "Lorem ipsum",

id: "99149129492149214",

todos: {

initial: [

{

description: "Lorem ipsum dolor sit amet.",

createdBy: "Tobias",

id: "99149129492149215",

}

],

wip: [

{

description: "Lorem ipsum dolor sit amet.",

createdBy: "Tobias",

id: "99149129492149216",

}

],

finished: []

}

}

我想创建这个函数,让用户通过单击按钮在项目中创建一个新的待办事项 . 然后应该将项目添加到 todos.initial 数组中,并使用每个todo所遵循的相同对象结构 .

我知道如何创建一个新项目 . 然后我会在 Projects.vue 中创建一个方法,使用Vuex中的动作和变异,使用新项目的数据推送商店中 projects 数组的状态 . 为此,我不必指定除了将数据推送到的数组之外的任何内容 .

但是,我需要帮助理解的是如何告诉Vuex在我单击"add todo"按钮的项目中推送一个数组 . 例如,如果用户正在使用路径 projects/99149129492149214 查看项目并且用户单击"add todo"按钮,则我希望将新待办事项推送到该特定项目的 todos.initial 数组 .

这方面的最佳做法是什么?我想我可能不得不将当前查看的项目的ID传递给变异方法,但我不知道如何正确完成 .

Logo

前往低代码交流专区

更多推荐