#vue.js #vue-component
Вопрос:
У нас есть страница vue-js (@vue/cli 4.5.6) с многочисленными компонентами, которая в основном работает нормально. Один компонент делает что-то, чего я не понимаю: есть два радиоприемника, один вверху страницы, другой внизу. Они кажутся совершенно не связанными; вот один
<template v-for="qSection in qSections">
...
<!--- loop to output individual questions here --->
<tr v-for = "question in qSection.questions">
<td>
{{ question.txt }}
<div v-if="question.incf">
<br/>
<textarea rows="2" cols = "80" :name= "question.cmt"
v-model="question.cmt" placeholder = "Comments here"
class="hideOnPrint"
/>
<div class="print-only"> {{ question.cmt }} </div>
</div>
</td>
<!-- okay, three more tds to hold radio box-->
<template v-for="icnt in [1,2,3]">
<td>
<label v-if="question.otherAns" class="other-ans-label">
{{ question.otherAns[icnt].txt }}
</label><br/><br/>
<input type = "radio" :name= "question.quesn" :value = "(icnt%3)"
v-model="question.answer"/>
</td>
</template>
</tr>
Вот другой
<template v-if="section.otype1 != 'Laboratory'">
<div class="hideOnPrint">
<input type = "radio" :name = "section.accept" :value="1"
v-model="section.accept"
>
{{acceptPhrase}}
</input>
<br/><br/>
<input type = "radio" :name = "section.accept" :value="0"
v-model="section.accept"
>
Investigation is incomplete. See comments.
</input><br/><br/>
</div>
</template>
Итак, происходит то, что при нажатии переключателя в нижней области (только для значения=»1″) отменяется нажатие переключателя в верхней области (вопрос.ответ, в зависимости от того, что выбрано).
Согласно приложению Vue в Инструментах разработчика, данные верхней области все еще заданы: вопросы.ответ = 2, скажем. И действительно, если я установлю его равным 1 там и обратно 2, этот радиоприемник будет правильно перепроверен.
Как это происходит и что мне нужно изменить, чтобы исправить это? Или что я должен сделать, чтобы диагностировать это. Спасибо!
Я хотел бы привести рабочий пример, но не знаю, как это сделать; остальная часть страницы состоит из множества частей.
Ответ №1:
О, ничего себе: я понял свою ошибку. Это те строки в коде
:имя= «вопрос.вопрос»
и
:имя = «раздел.принять».
Они устанавливают имя радиоприемника в значение этих полей. Они оба в конечном итоге равны 1, и поэтому два радиоприемника становятся одним радиоприемником. Щелчок по одному выключает другой. Вообще не следует использовать имя; v-модель выполняет свою работу.