Vue.js

Question

我是 Vue.js 的新手，在处理特定案例时遇到了问题。我有多个无线电组，我想将它们绑定到单个 Vue.js 数据数组。在您输出结果数组之前，这似乎按预期工作。

Vue.js 正在创建一个（任意？）包含许多未定义元素的长数组。该数组还包含正确的值。我下面的示例既将结果记录到控制台，又将其输出到文本框，您可以在其中看到所有其他逗号。

jQuery(document).ready(function($) {
  var vm = new Vue({
    el: '#quiz-layout',
    data: {
      'question': []
    },
    watch: {
      question: {
        handler: function(v) {
          console.log(v);
        },
        immediate: true,
      }
    }
  });
});

<!doctype html>
<html>

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <script src="http://cdn.jsdelivr.net/vue/1.0.12/vue.min.js"></script>
</head>

<body>
  <form id="quiz-layout">
    <h4>What is your name?</h4>
    <label for="question_0_answer_0">Bob</label>
    <input type="radio" name="question[0]" value="bob" id="question_0_answer_0" v-model="question[0]" />
    <br />
    <label for="question_0_answer_1">Jim</label>
    <input type="radio" name="question[0]" value="jim" id="question_0_answer_1" v-model="question[0]" />
    <br />

    <h4>How old are you?</h4>
    <label for="question_1_answer_0">10</label>
    <input type="radio" name="question[1]" value="10" id="question_1_answer_0" v-model="question[1]" />
    <br />
    <label for="question_1_answer_1">54</label>
    <input type="radio" name="question[1]" value="54" id="question_1_answer_1" v-model="question[1]" />
    <br />
    <input type="text" value="{{question}}" />
  </form>
</body>

</html>

生成的数组应该只有两个元素长，而不是十一个元素。所有其他元素来自哪里？

Answer 1

我查看了你的问题，发现了 Vue.js 的核心错误。

但是，我向 GitHub 发送了一个 pull request，我正在等待创作者的回复。

错误修复后我会更新此答案。

编辑

错误已修复。

Vue.js - 将同名的无线电元素绑定到数组

Vue.js - Binding radio elements of same name to array

javascript

arrays

编辑