title: Vue.js - How can I change output value if input is empty
body: <p>I'm new to vue.js.
  I want to change the output text to the same string that's in placeholder if input value is empty.
  Here is my desired code</p>
  
  <pre><code>&lt;div id="form"&gt;
  &lt;input class="input-f" type="text" placeholder="please enter your first name" v-model="firstName"&gt;
  &lt;input class="input-l" type="text" placeholder="please enter your last name" v-model="lastName"&gt;
  &lt;div class="output"&gt;
    &lt;p class="f"&gt;{{firstName}}&lt;/p&gt;
    &lt;p class="l"&gt;{{lastName}}&lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>vuejs with jquery</p>
  
  <pre><code>(function(window) {
  var data = {
    firstName: "Stack",
    lastName: "Overflow",
  }
  var vm = new Vue({
    el: "#form",
    data: data,
    watch: {
      firstName: function(v) {
        if (!v) {
          $(".f").text($(".input-f").attr("placeholder"))
        }
      },
      lastName: function(v) {
        if (!v) {
          $(".l").text($(".input-l").attr("placeholder"))
        }
      }
    }
  
  })
  })(window)
  </code></pre>
  
  <p>Also, if I leave the input box empty, the data won't bind again.
  Please tell me how can I achieve it?
  <a href="https://jsfiddle.net/je491vas/" rel="nofollow noreferrer">https://jsfiddle.net/je491vas/</a></p>