Vuejs 및 Vuex 어레이에 무선 입력 값만 입력하는 방법

Vuejs 및 Vuex 어레이에 무선 입력 값만 입력하는 방법

state: {
		questions: [
		{
			"id": 1,
			"name": "q1",
			"category": "English Language",
			"type": "multiple",
			"question": "What is a name of any person, animal, place, thing and feeling?",
			"correct_answer": "Noun",
			"incorrect_answers": [
			"Pronoun",
			"Noun",
			"Adverb",
			"Adjective"
			]
		}
    ]
    answer = "",
    answer = []
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>

저는 퀴즈 앱을 만들고 있으며 Vuex를 상태 관리에 사용하고 있습니다.각 질문에는 4개의 무선 값(응답)이 있으며 마지막으로 선택한 값(응답)을 Vuex 상태에 있는 어레이에 넣어야 합니다.정상적으로 동작합니다만, 같은 질문에서 다른 무선 입력을 선택할 때마다 어레이에 입력됩니다.단, 각 질문에서 선택한 값만 입력합니다(무조건에 관계없이).전환 횟수)를 선택합니다.

주의 10개의 "질문" 배열은 다음과 같습니다.

state: {
        questions: [
            {
            "id": 1,
            "name": "q1",
            "category": "English Language",
            "type": "multiple",
            "question": "What is a name of  person, animal, place or thing?",
            "correct_answer": "Noun",
            "incorrect_answers": [
            "Pronoun",
            "Noun",
            "Adverb",
            "Adjective"
            ]
}
...
   }

템플릿은 다음과 같습니다.

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
```
<div class="card-text ml-4" v-for="(answer, index) in question.incorrect_answers" :key="index" >
  <label class="form-check-label">
    <!-- <input type="radio" name="answer" class="mb-2" v-model="getAnswers[index]" :value="answer"> {{answer}} -->
    <input type="radio" :name="question.name" class="mb-2" :value="answer" @change.stop="newAnswer(question.id, answer)" /> {{answer}}
  </label> <!-- work on postanswer -->
</div>
```

내 돌연변이는 이렇게 생겼지

mutations:{
		ANSWER(state, id, ans){
			state.answer = id;
			if(id === "q1"){
				state.answers.push(state.answer);
			} else {

			}
		}
 }

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.js"></script>

몇 주 동안 이걸 탔는데 아직 못 받았어.제가 그걸 어떻게 합니까?

어레이에 답을 입력하기 위한 논리

1. 어레이 인덱스를 사용하여 응답이 이미 입력되었는지 확인합니다.
2. 존재하는 경우 이전 항목을 제거하고 최신 항목을 삽입합니다.

위 로직의 코드는 다음과 같습니다.

  // Trying to find index of chosed answer
  const indexOfExistingChoice = this.choosedAnswers.findIndex(
    answer => answer.id === selectedAnswer.id
  );

  if (indexOfExistingChoice >= 0) {
    // Choice already selected
    // Removing the choice from the array
    this.choosedAnswers.splice(indexOfExistingChoice, 1);        
  }

  // Pushing into the array
  this.choosedAnswers.push(selectedAnswer);

언급URL : https://stackoverflow.com/questions/58362052/how-to-put-just-a-value-from-a-radio-input-into-an-array-in-vuejs-and-vuex