vue中superagent从API获取数据并在页面中v-for中循出来

第一次接触superagent，一开始在vue中都不知道在那里写

类型可参考： https://www.jianshu.com/p/98b854322260

首先要确保有这个包 ，没有就要 npm install 一下

然后导入引入

在script写就好了

// 配置API接口地址 自己定义或者是直接superagent的接口处写全称看个人习惯
const root = '/api/material/v1/material';
// 引用superagent
const request = require('superagent');

利用es6的语法直接在导出中的，在vue的生命周期函数create的（){}中写

  created(){
	                console.log(request);
			//获取素材列表superagent请求
	                const that = this;
                        request
                                .get('http://')//api接口
                                //.send({})//需要传给后台的数据
                                //.set('X-API-Key', 'foobar')//
                                .set('Accept', 'application/json')//用来告诉服务端消息主体是序列化后的 JSON 字符串
                                .end(function(err, res){
                                        if (err || !res.ok) {
                                                alert('Oh no! error');
                                        } else {
                                                console.log(res.body.data.materialList);
//这里用到了that是因为如果是this.emailMaterial的话，这里的this的指向就有问题，所以在前面定义了this的指向。这样就把获取的数据放到你定义的emailMaterial（这个是data中自己定义的空的object）
                                                that.emailMaterial =res.body.data;
//                                                console.log(that);
//                                                console.log(emailMaterial);
//                                                alert('yay got ' + JSON.stringify(res.body));
                                        }
                                });
        },

在前台页面循环数据就好了

<li v-for="item in emailMaterial.materialList" style="border: 1px solid red;">
					<span v-text="item. materialContent">
					</span>
				</li>