title: How can I set 2 data values with a select input?
body: <p>I am using VueJS to get data from my Laravel API. It's an array with objects. I have a select element and I am using v-for on the option element. v-model is on the select element.</p>
  
  <p>I want to set 2 data properties when I select on of the option, but I can't figure out how to do it.</p>
  
  <p>I have tried setting up computed properties, but it does not work or I am doing it wrong.</p>
  
  <p>Template:</p>
  
  <pre><code>&lt;div class="col-4"&gt;
       &lt;label for="name"&gt;Customer&lt;/label&gt;
  
       &lt;select class="form-control" v-model="form.customer"&gt;
            &lt;option disabled value&gt;Select the Customer&lt;/option&gt;
            &lt;option v-for="customer in customers" :key="customer.id"&gt;{{ 
                    customer.customer }}&lt;/option&gt;
       &lt;/select&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Data:</p>
  
  <pre><code>data: () =&gt; {
      return {
        customers: [],
        form: {
          customer: "",
          color: "#ff8080",
          job: "",
          start_date: "",
          deadline_date: "",
          delivery_date: "",
          boilermaker: ""
        }
      };
    },
  </code></pre>
  
  <p>I want to set form.color when I select the customer name from the options list.</p>