Detailed explanation of how to use AJAX to obtain data in vue

During VUE development, data can be obtained using jquery and vue-resource. When obtaining data, you must give an initial value of the data.

See the following example:

<script type="text/javascript">
  
   new Vue({
      el:'#app',
      data:{data:""},
      created:function(){
        var url="";
        var _self=this;
        $.get(url,function(data){
          _self.data=eval("(" + data +")");
        })
        /*
        this.$(url).then(function(data){
          var json=;
          =eval("(" + json +")");
        },function(response){
          (response);
        })*/
      }
     });
  </script>

Here you must set the initial data of vue data, even if the data is empty at this time.

When using ajax to get data, it is more appropriate to use vue-resource.

Using vue-resource code is as follows:

<script type="text/javascript">
  
   new Vue({
      el:'#app',
      data:{data:""},
      created:function(){
        var url="";
      
        this.$(url).then(function(data){
          var json=;
          =eval("(" + json +")");
        },function(response){
          (response);
        })
      }
     });
  </script>

Here we see that when setting VUE instance data, you can set the vue data by directly using .

When using jquery, the code is as follows:

<script type="text/javascript">
   new Vue({
      el:'#app',
      data:{data:""},
      beforeCreate:function(){
        var url="";
        var _self=this;
        $.get(url,function(data){
          _self.data=eval("(" + data +")");
        })
      }
     });
  </script>

Here, if you need to assign this to _self first, and then use it in the jquery get method, so that it is not as convenient as vue-resource.

The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.