title: Vue.js watched data chang twice with only one request
body: <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;meta charset="utf-8" /&gt;
      &lt;title&gt;&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div id="app"&gt;
          &lt;div class="layui-input-block" style="width:510px;"&gt;
              &lt;form class="layui-form" action=""&gt;
                  &lt;select v-model="form.entrCode"&gt;
                      &lt;option value=""&gt;please select an entry&lt;/option&gt;
                      &lt;option value="1"&gt;1&lt;/option&gt;
                      &lt;option value="2"&gt;2&lt;/option&gt;
                      &lt;option value="3"&gt;3&lt;/option&gt;
                      &lt;option value="4"&gt;4&lt;/option&gt;
                  &lt;/select&gt;
              &lt;/form&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  
  &lt;script src="//cdn.bootcss.com/vue/2.2.4/vue.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
      var app = new Vue({
          el: "#app",
          data: {
              action: '',
              form: {
                  entrCode: '',
              }
          },
          watch: {
              action: function (val) {
                  if (val !== "add"){
                      var vm = this;
                      //$.get("/park/GetLEDDtl", { areaId: vm.form.code }, function (rs) {
                      //    vm.form = rs;
                      //}, "json");
  
                      //simulate setting on ajax.success
                      vm.form = { "entrCode": "20" };
                  }
              },
              "form.entrCode": function (val, old) {
                  alert("【entryCode changed】 new:" + val + "    old:" + old);
              }
          },
          created: function () {
              this.action = "edit";
          }
      });
  &lt;/script&gt;
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/OVDV7.gif" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/OVDV7.gif" alt="enter image description here"></a></p>
  
  <p>Please look at my code. I've only set <code>app.form = object</code> once, why there are two value changed be watched? </p>
  
  <p>First, it changes from <code>''</code> to '20', which is what I'm expected, but suddenly it changes from <code>20</code> to <code>undefined</code>.  </p>
  
  <p>(The code patsed I commented ajax request, and set value directly.)</p>
  
  <p>What just happened?</p>