title: How do I refactor v-model with get,set and toggle function in this case?
body: <p>I have vue templates that is toggled each by a function for <strong>v-show</strong> and its corresponding getter and setter for <strong>v-model</strong>:</p>
  
  <pre><code> &lt;p&gt;To : &lt;span v-show="!emailToSW"&gt;{{toEmailSet}}&lt;/span&gt;
        &lt;input v-show="emailToSW" type="text" v-model.lazy="toEmailSet" /&gt;
        &lt;a href="#" @click.prevent="toggleEmailTo();"&gt;{{emailToSW ? ' ' : ' '}}&lt;/a&gt;
   &lt;/p&gt;
  </code></pre>
  
  <p></p>
  
  <pre><code> toggleEmailTo(){
     this.emailToSW = !this.emailToSW;
   },
  </code></pre>
  
  <p></p>
  
  <pre><code> toEmailSet:{
      get(){
        return this.componentGetObject.toEmail 
      },
      set(val,$event){
        return this.componentSignal({pro:'toEmail',ev:event.target.value}) 
      }
  </code></pre>
  
  <p>it's getting cumbersome when you have dozens of pair like this with only changing variable name.</p>
  
  <p>is there a way to refactor toggle and v-model getter and setter for this case so it will accepting more general variable, not hard-coded <code>toEmail</code> or <code>emailToSW</code> in this case?</p>
  
  <p><strong>Addition</strong>:
  Actually I'm using vuex for each object properties mutations like so:</p>
  
  <pre><code>Vue.set(state.componentObject, payload.pro, payload.ev)
  </code></pre>
  
  <p>Triggered on mounted for complete initial object:</p>
  
  <pre><code>mounted:function(){
      this.componentObject(this.items) //local state copied to mutations
    }
  </code></pre>
  
  <p>and the redundant functions is like this:</p>
  
  <pre><code>&lt;p&gt;Fault Occurring Time: &lt;/p&gt;
      &lt;span v-show="!startDateSW"&gt;{{startDateSet}}&lt;/span&gt;
      &lt;input v-show="startDateSW" type="text" v-model.lazy="startDateSet" /&gt;
      &lt;a href="#" @click.prevent="toggleStartDate();"&gt;{{startDateSW ? ' ' : ' '}}&lt;/a&gt;
  </code></pre>
  
  <p>dozens of them :D
  being member of items object:</p>
  
  <pre><code>items:{toEmail:'xxx',startDate:'yyy', ... ...}
  </code></pre>