仅从单选按钮中选择一个选项后如何发布两个属性的数据？

Question

我有单选按钮，您可以选择两种付款方式 - 30 天和 60 天。选择一个选项后，我将发出一个发布请求并将所选值发送到数据库。我想要做的是，单击一个选项后，我想同时发送两个属性的值。

payment_term_days:60现在它只发送or的值payment_term_days:30。选择一个选项后我想要得到的是： payment_term_days:60和payment_term_pct: 1,5

我正在使用 vue.js。怎么可能，我可以在v-model中传递两个参数吗？

万分感谢。

超文本标记语言

<form class="radioForm" role="form">

  <input 

         v-model = "newContract.payment_term_days"

         type="radio"

         id="60" 

         name="payment" 

         value="60"

         >

  <label for="60">60 Days, 1,5 % Commission</label><br>

  <input 

         v-model = "newContract.payment_term_days"

         type="radio" 

         id="30" 

         name="payment" 

         value="30"

         >

  <label for="30">30 Days, 4,0 % Commission.</label><br>

</form>

视图.js

new Vue({

  el: "#app",

  delimiters: ["[[", "]]"],

  data() {

    return {

      newContract: {

        payment_term_days: "",

        payment_term_pct: null

      }

    }

  },

  methods: {

    sendAGB(newContract) {

      let fd = new FormData();

      fd.append("payment_term_days", newContract.payment_term_days);

      fd.append("payment_term_pct", newContract.payment_term_pct);

      let req = new Request(agbPath, {

        body: fd,

        headers,

        method: "POST"           

      });  

      fetch(req) 

        .then((response) => response.json())

        .then((data) => {

        alert("You have agreed terms and conditions")

        this.newContract = {

          payment_term_days: "",

          payment_term_pct: 0,

        }

      })

        .catch((error) => console.log("error", error));

    },

  }

}) 

Answer 1

您可以使用计算的。删除data变量payment_term_pct并使用：data() {&nbsp; return {&nbsp; &nbsp; newContract: {&nbsp; &nbsp; &nbsp; payment_term_days: ""&nbsp; &nbsp; }&nbsp; }},computed: {&nbsp; payment_term_pct() {&nbsp; &nbsp; const daysToPct = {&nbsp; &nbsp; &nbsp; 30: 4,&nbsp; &nbsp; &nbsp; 60: 1.5&nbsp; &nbsp; }&nbsp; &nbsp; return daysToPct[this.newContract.payment_term_days];&nbsp; }}对数据的方法引用应该是：fd.append("payment_term_days", this.newContract.payment_term_days);fd.append("payment_term_pct", this.payment_term_pct);