在vue demo中使用axios请求

前端代码：

    
    
    
    
    
        

            发送
            
            

                
{{list.name}}
            
            
            

            添加
            

                
{{item.type}}=={{item.name}}
            
        

    

get和get2，以及sendPost和sendPost2的区别就是axios请求的写法不同。
点击发送按钮，通过get请求获取数据，并在页面上显示。
点击添加按钮，使用post请求把obj交给后端处理。

后端node代码：

/**
Simple Server for web api test.
*/
/**Connect是一个node中间件（middleware）框架。
如果把一个http处理过程比作是污水处理，中间件就像是一层层的过滤网。
每个中间件在http处理过程中通过改写request或（和）response的数据、状态，实现了特定的功能。
中间件就是类似于一个过滤器的东西，在客户端和应用程序之间的一个处理请求和响应的的方法。*/

var connect = require('connect');  //创建连接
var bodyParser = require('body-parser');   //body解析
var arr = []; 
var app = connect()
    .use(bodyParser.json())   //JSON解析
    .use(bodyParser.urlencoded({extended: true}))
    //use()方法还有一个可选的路径字符串，对传入请求的URL的开始匹配。
    //use方法来维护一个中间件队列
    .use(function (req, res, next) {
        //跨域处理
        // Website you wish to allow to connect
        res.setHeader('Access-Control-Allow-Origin', '*');  //允许任何源
        // Request methods you wish to allow
        res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');  //允许任何方法
        // Request headers you wish to allow
        res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type,X-Session-Token');   //允许任何类型
        res.writeHead(200, {"Content-Type": "text/plain;charset=utf-8"});    //utf-8转码
        next();  //next 方法就是一个递归调用
    })
    .use('/list', function(req, res, next) {
        var data={
                "code": "200",
                "msg": "success",
                "result": [{name:'手机1',state:'未采购'},
                    {name:'手机2',state:'未采购'},
                    {name:'手机3',state:'已采购'},
                    {name:'手机4',state:'未采购'}]
            }
            res.end(JSON.stringify(data));
            next();      //
    })
    .use('/list_add', function(req, res, next) {
        console.log(req.method)
        if(req.method=='POST') {
            console.log(req.body.name);
            //console.log(req.originalUrl, req.url);
            arr.push({type:req.body.type,name:req.body.name});
            var data = {"code":200,"msg":"success",result:arr};
            res.end(JSON.stringify(data));
        } else {
            res.end(JSON.stringify({}));
        }
        next();
    })  
    .listen(3333);
console.log('Server started on port 3333.');

后端收到了前端发来的obj，使用req对象读取，并且将数据存到arr中，再次返回给前端。