title: How can I refactor repetitive conditional Vue.js code?
body: <p>I have this code in my Vue.js component:</p>
  
  <pre><code>mounted() {
      if (localStorage.dobDate) {
        this.form.dobDate = localStorage.dobDate;
      }
  
      if (localStorage.dobMonth) {
        this.form.dobMonth = localStorage.dobMonth;
      }
  
      if (localStorage.dobYear) {
        this.form.dobYear = localStorage.dobYear;
      }
    },
  
    watch: {
      "form.dobDate": {
        handler: function(after, before) {
          localStorage.dobDate = after;
        },
        deep: true
      },
      "form.dobMonth": {
        handler: function(after, before) {
          localStorage.dobMonth = after;
        },
        deep: true
      },
      "form.dobYear": {
        handler: function(after, before) {
          localStorage.dobYear = after;
        },
        deep: true
      }
  </code></pre>
  
  <p>Ask you can see it can get very repetitive, if for example I had a large form, and I don't want to do this for every field. Is there a way I can approach this to make it more DRY? Is there a way I can make it more dynamic for any field in a form for example?</p>