首页 > Web开发 > 详细

2017.12.07 Ajax获取服务器数据并发送到前端

时间:2017-12-07 10:08:53      阅读:294      评论:0      收藏:0      [点我收藏+]

1.前端:在React渲染页面之前就加载服务器数据:

技术分享图片

 componentWillMount()  {
        console.log("aaaaaaaa");

        var data2={

            action:"queryTaskOfManager"
        };
        Common.getData(JSON.stringify(data2),function (ret) {
            alert(ret);
        });

    }

 

2.前端调用这个React生命周期函数:

技术分享图片

 

3.ajax文件封装成组件后,导出:

技术分享图片

 

4.Ajax文件的具体方法:

技术分享图片

    getData: function (data2,successCallback) {
        var gg={};
        alert(data2);
        $.ajax({
            url: http://192.168.1.144:8080/sfboffice/askForLeaveServlet,
            type: GET,

            data:JSON.parse(data2),
            timeout: 1000,
            cache: false,
            beforeSend: LoadFunction, //加载执行方法
            error: erryFunction,  //错误执行方法
            success: succFunction //成功执行方法
        })
        function LoadFunction() {
            alert("加载中....");
        }
        function erryFunction() {
            alert("error");
        }
        function succFunction(data) {
            console.log(data)
            //eval将字符串转成对象数组
            var tt=JSON.stringify(data);
            successCallback(tt);
        }
    }

 

5.前端定义:获取ajax得到的服务器的数据的函数:

(1)导入ajax封装的组件:

技术分享图片

(2)调用ajax中的方法:

技术分享图片

  componentWillMount()  {
        console.log("aaaaaaaa");

        var data2={

            action:"queryTaskOfManager"
        };
        Common.getData(JSON.stringify(data2),function (ret) {
            alert(ret);
        });

    }

 

2017.12.07 Ajax获取服务器数据并发送到前端

原文:http://www.cnblogs.com/hqutcy/p/7997632.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!