vue 数据更新的一个问题

Question

初学VUE，发现要个问题，让我无法理解
html:

<div id="watch-example">
    <p>
      请输入要查询的省份:
      <input v-model="question" type="text"/>
    </p>
    <p>{{answer}}</p>
</div>
<script src="js/jquery-1.12.4.min.js"></script>
<script src="js/vue.min.js"></script>

因为别的我用的不孰，所以我直接引了个JQ进行AJAX通信
js:

     var watchExampleVM=new Vue({
      el:"#watch-example",
      data:{
        question:'',
        answer:'省份ID查询'
      },
      watch:{
        //如果 question  发生改变，这个函数会执行
        question:function(newQuestion){
          this.answer='正在查询..';
          this.getAnswer();
        }
      },
      methods:{

        getAnswer:function(){

          var tAnswer=this.answer;
          console.log(tAnswer);  //  在这里我拿了一下数据，数据是正常的
          var pName=this.question;
          if(this.question!=""){
            $.ajax({
              type:'post',
              url:'http://192.168.1.1:8383/_API/_province/get',
              data:null,
              success:function(data){
                if(data.code=='E0000'){
                  for(var i=0;i<data.data.length;i++){
                    var one=data.data[i];
                    if( one.name == pName ){
                      console.log(pName,tAnswer,tAnswer===watchExampleVM.answer);  //在这里我console一下明明是true，可以为什么数据不更新哪？
                      tAnswer="省份ID："+one.id;
                      return;
                    }
                  }
                  tAnswer="未找到省份ID";

                }else{
                  watchExampleVM.answer=data.message;  //直接写上数据是可以更新的
                }
              }
            });
          }
        }


      }
    });

为什么明明是全等的引用传递，在jq的AJAX里是更新不了的，可是直接写确是可以更新？

这是我的响应数据：

{"code":"E0000","data":[{"id":"1","name":"北京市","icon":"beijing","fid":"0","definition":"1","level":"1"},{"id":"22","name":"天津市","icon":"T","fid":"0","definition":"1","level":"1"},{"id":"43","name":"河北省","icon":null,"fid":"0","definition":"1","level":"6"},{"id":"227","name":"山西省","icon":null,"fid":"0","definition":"1","level":"6"},{"id":"472","name":"辽宁省","icon":null,"fid":"0","definition":"1","level":"6"},{"id":"587","name":"吉林省","icon":null,"fid":"0","definition":"1","level":"6"},{"id":"657","name":"黑龙江省","icon":null,"fid":"0","definition":"1","level":"6"},{"id":"801","name":"上海市","icon":"S","fid":"0","definition":"1","level":"1"},{"id":"823","name":"江苏省","icon":null,"fid":"0","definition":"1","level":"6"},{"id":"943","name":"浙江省","icon":null,"fid":"0","definition":"1","level":"6"},{"id":"1045","name":"安徽省","icon":null,"fid":"0","definition":"1","level":"6"},{"id":"1168","name":"福建省","icon":null,"fid":"0","definition":"1","level":"6"},{"id":"1263","name":"江西省","icon":null,"fid":"0","definition":"1","level":"6"},{"id":"1374","name":"山东省","icon":null,"fid":"0","definition":"1","level":"6"}]}

Answer 1

getAnswer: function() {
    if(this.question != "") {
        $.ajax({
            type: 'post',
            url: 'http://192.168.1.1:8383/_API/_province/get',
            data: null,
            success: function(data) {
                if(data.code == 'E0000') {
                    for(var i = 0; i < data.data.length; i++) {
                        var one = data.data[i];
                        if(one.name == this.question) {
                            this.answer = "省份ID：" + one.id;
                            return;
                        }
                    }
                    this.answer = "未找到省份ID";

                } else {
                    watchExampleVM.answer = data.message;  //直接写上数据是可以更新的
                }
            }.bind(this)
        });
    }
}

这样改就可以了，传递一下this作用域，就不需要重新声明变量去指向引用

学vue还是用npm+webpack之类的打包编译方式吧，现在已经是2018年，页面引用已经很过时了，而且es6语法和众多babel插件能帮你节省很多时间

Answer 2

是我自己的引用写错了，谢谢 @ wwh_ 的提醒。