Question

另一个复选框有条件禁用的无线电表单。一个单选按钮可以发送true：false，另一个单选按钮有一个发送一些数据的输入。

我可以做哪些检查来确定检查哪个无线电以及如何发送true：false或数据。

  <input type="radio" id="one"
  value="Voicemail"
  v-bind:disabled="!checked"
  v-model="checkedValue">
  <label for="one">Voicemail</label>

  <input type="radio" id="two"
  value="Destination"
  v-bind:disabled="!checked"
  v-model="checkedValue">

  <label for="two">Destination</label>
  <input type="text" v-model="destinationNumber" v-bind:disabled="!checked">
  <button class="button" type="submit" name="button" v-bind:disabled="!checked">Submit</button>

data () {
  return {
      checked: '',
      checkedValue: '',
      destinationNumber: ''
  }
},
methods: {
  handleExtensionFormSubmit () {
    const postData = {
      destination: this.checkedValue = 'Destination' ? this.destinationNumber : '',
      voicemail: this.checkedValue = 'Voicemail' ? true : ''
    }

this.$http.put(/someUrl)

我的请求应如下所示：

destination: 666,
voicemail: false

或者

destination: '',
voicemail: true

感谢所有帮助。

Answer 1

您的代码现在的主要问题是您的帖子对象。

postData = {
  destination: this.checkedValue = 'Destination' ? this.destinationNumber : '',
  voicemail: this.checkedValue = 'Voicemail' ? true : ''
}

this.checkedValue = 'Destination'不会检查将checkedValue的值设置为Destination的任何内容，它始终会评估为true。您需要将这两个更改为==。此外，如果您要为语音邮件返回false，则需要?true:false而不是?true:''。我不确定你的所有代码应该做什么，但这应该让你走上正轨。

Vue：检查选中的复选框，并根据不同的数据发送

1 个答案: