반응형
스토어 Vuex에서 항목 삭제
저희 가게에 있는 아이템을 삭제하고 싶습니다.이 솔루션 https://stackoverflow.com/a/59686164/11984242은 제가 찾고 있는 것 같습니다만, 오브젝트에 다른 「레벨」이 있기 때문에, 서브 레벨에서 요소를 삭제하는 방법을 모릅니다.
데이터 구조
{
id: 1,
name: 'My customer one',
projects: [
{
id: 1,
name: 'name',
tests: [
{
id: 1,
name: 'name test'
},
{
id: 2,
name: 'name test 2'
}
]
},
{
id: 2,
name: 'other name'
}
]
}
위의 링크를 사용하여 프로젝트를 삭제하는 방법을 확인했습니다.하지만 어떻게 한 줄의 테스트를 삭제할 수 있을까요?
제 vue에서는 이렇게 합니다.
this.$store.commit("deleteTest", this.idProject, e)
그리고 이건 내 가게 안에 있어:
deleteTest(state, {data, e}) {
const allTestsOfProject = state.listProjects.projects.find(p => p.id === data)
console.log("all", allTestsOfProject)
const oneTest = allTestsOfProject.studies.find(q => q.id === e)
console.log("one test", oneTest)
//state.listProjects.projects.splice(oneTest, 1)
}
도와주셔서 감사합니다.
코드에 두 가지 문제가 있습니다.
첫 번째 문제
commit
함수는 2개의 파라미터만 받습니다.
- commit name (String으로 지정)
- 페이로드 Pbject
그래서 여러 개의 소품을 건네고 싶으면 물건으로 넘겨야 한다.
this.$store.commit("deleteTest", this.idProject, e) // WON'T WORK
this.$store.commit("deleteTest", {data: this.idProject, e}) // WILL WORK
이제 전화를 걸 수 있습니다.deleteTest(state, {data, e})
두 번째 문제
개체 자체가 아니라 INDEX of tests 개체를 얻어야 합니다.
const oneTest = allTestsOfProject.studies.find(q => q.id === e) // WON'T WORK
const oneTest = allTestsOfProject.studies.findIndex(q => q.id === e) // WILL WORK
다음 번호로 전화:allTestsOfProject.studies.findIndex (q => q.id === e)
테스트를 삭제하다
언급URL : https://stackoverflow.com/questions/66780445/deleting-an-item-in-the-store-vuex
반응형
'programing' 카테고리의 다른 글
VueJ는 컴포넌트에서 목록을 다시 렌더링하지 않음 (0) | 2022.08.08 |
---|---|
자바 매트릭스 연산 라이브러리의 성능 (0) | 2022.08.08 |
다른 클래스의 메서드에 대한 Javadoc 링크 (0) | 2022.08.08 |
루트가 변경되면 이전 컴포넌트의 모든 http 요청을 취소합니다. (0) | 2022.08.08 |
롬복에서 세터/게터 1개 누락 (0) | 2022.08.08 |