选择值然后使用 vue.js 提交表单不起作用答案

【问题标题】：selecting the value and then submitting the form using vue.js dosent work选择值然后使用 vue.js 提交表单不起作用
【发布时间】：2018-12-11 04:06:55
【问题描述】：

我的问题是，当我选择输入值然后提交表单时，表单中的answer 值在answer.php - $_POST['answer'] 中为空这是我的html代码：

<form action="answer.php" ref="send" method="post" class="container">
<h1><?= $question['Question']; ?></h1>
<input type="hidden" name="id" value="<?= $question['ID']; ?>">
<div class="custom-control custom-radio" v-on:click="demo">
    <input type="radio" id="answer1" name="answer" class="custom-control-input" value="1" v-model="answer">
    <label class="custom-control-label" for="answer1"><?= $question['Answer1']; ?></label>
</div>
<div class="custom-control custom-radio">
    <input type="radio" id="answer2" name="answer" class="custom-control-input" value="2" v-model="answer">
    <label class="custom-control-label" for="answer2"><?= $question['Answer2']; ?></label>
</div>
<div class="custom-control custom-radio">
    <input type="radio" id="answer3" name="answer" class="custom-control-input" value="3" v-model="answer">
    <label class="custom-control-label" for="answer3"><?= $question['Answer3']; ?></label>
</div>
</form>

这是我的 vue 代码：

new Vue({
    el: '#app',
    data: {
        answer: 0,
    },
    methods: {
        demo() {
            this.answer = 1;
        },
    },
    watch: {
        answer(val) {
            this.$refs.send.submit();
        },
    },
});

发送表单就像我从未选择过表单中的任何内容一样，没有answer。我做错了什么？

更新：当有人在div 内点击时，我正在考虑，但不是在文本本身。在 div 的“空白”空间中。那是我的问题发生的时候，我希望他们能够点击 div 并选择答案，而不是只在文本上。

在下面的 gif 中，您可以看到 1 是 answer 的值，demo123 是 id 的值，当我单击单选按钮时，您可以看到它们在发送表单之前发生了变化，但您也可以看到，当加载answer.php 时，id 的值是value（默认值）并且没有找到answer 值。

【问题讨论】：

我尝试测试您的代码，它工作正常。在我的 answer.php 文件中，它显示 $_POST['answer'] 。您应该在网络浏览器中检查您的请求
我只能从网络选项卡中看到的帖子问题中获得隐藏的id 输入。我在那里看不到任何answer 值，问题出在单击div 而不是文本本身时。你试过了吗，因为这是我希望能够使用的功能

标签： javascript forms vue.js

【解决方案1】：

我设法使用此代码使其工作

methods: {
    demo() {
        this.$refs.send[1].checked = true;
        this.$refs.send.submit();
    },
},

所以，当现在有人点击div 时，第一个单选按钮被选中，然后是发送的表单。如果有人有更好的解决方案，请告诉我！谢谢！

【讨论】：