vue.js请求数据

三种方法,

1.是用jq的ajax请求之后将数据放到vue的data中,

2.是用vue-resource请求

3.axios

一、用jq ,ajax异步请求后,接收到返回的data参数并显示在前端 如下

1. 引入js,jQuery

2.html渲染表格用的指令 ==>

v-for ="data in datas "

 

.3 JS

        var goodsVue = new Vue({
            el: '#app',
            data: {
                datas : '',
            },
            methods: {
                nameSearch: function () {
                    var _self = this;
                    $.ajax({
                        type: 'GET',
                        url: '...',
                        success:function(data) {
                            _self.datas = data;
                        }
                    });
                }
            }
        })
ID 名称 年龄 简称
{{data.id}} {{data.name}} {{data.age }} {{data.shortName}}

二、用vue-resource


三 、 axios
 
import axios from 'axios'



var vm = new Vue(

{ 

el:"#list", 

data:{ datas : "", }, 

mounted: function() { 

axios.get(url),then(resp=>{

//resp是接口返回的数据

})

 }})

 

 
 
 
 
 
 
 
 
 
 
 
 

你可能感兴趣的:(web前端)