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

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);
        });

    }
时间: 2024-11-10 16:15:23

2017.12.07 Ajax获取服务器数据并发送到前端的相关文章

jquery $.ajax()获取服务器上的json数据

$.ajax({ url: 'http://127.0.0.1/work/open.json', success: function(data) { var ob = data; if (typeof(data) == 'string') { ob = stringtoObject(data); } }); var stringtoObject = function(json) { return eval("(" + json + ")"); } url为获取jso

用ajax获取后台数据,返回json数据,怎么在前台使用?

用ajax获取后台数据,返回json数据,怎么在前台使用呢? 后台 C# code ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 if (dataType == "SearchCustomer")                 {                     int ID;                     if (Int32.TryParse(CustomerID, out ID))                     {    

jquery autocomplete ajax获取动态数据,兼容各浏览器,支持中文

jquery.autocomplete.js经过改动,支持各种浏览器.支持中文输入! 1.效果图例如以下 2.HTML和ajax代码 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html

qml ajax 获取json数据示例

依赖ajax.js类库,以下代码很简单的实现了获取天气json数据并展示的任务 [TestAjax.qml] 1 import QtQuick 2.0 2 import QtQuick.Controls 1.2 3 import "ajax.js" as Ajax 4 5 6 /** 7 测试用ajax 获取 json 数据 8 */ 9 Grid{ 10 width: 600 11 height: 400 12 spacing: 10 13 columns: 2 14 15 Text

nodejs获取服务器数据到页面

const Koa = require('koa'); const Router = require('koa-router'); const app = new Koa(); const router = new Router(); const views = require('koa-views'); const json = require('koa-json'); const onerror = require('koa-onerror'); const bodyparser = req

jquery $.ajax 获取josn数据

<script type="text/javascript" src="jquery-1.9.1.js"></script> <script type="text/javascript"> function test() { $.ajax({ type: "get", cache: false, url: "../../ajax/Task.aspx", data: 'id

通过原生js的ajax或jquery的ajax获取服务器的时间

在实际的业务逻辑中,经常是与时间相关的,而前端能获得的时间有两个:客户端的时间,服务器的时间.客户端时间通过 javascript中的Date对象可以获取,如 Java代码   var dt = new Date(); var tm = dt.getTime(); 那么tm就是客户端的时间,另外也可以通过对应的getFullYear(),getMonth(),getDate()取到对应的年月日等...但这个时间可靠吗?好吧,那取服务器时间吧经常用到的是后台写一个php,jsp,cgi,asp..

ajax获取json数据及实现跨域请求

最近想练习一下ajax获取json数据 , 首先上网找一些在线的可用来测试的接口. -----------------------------------------------------这里是接口分割线 Begin-------------------------------------------------------------------------------------------------- 电商接口 淘宝商品搜索建议: http://suggest.taobao.com/s

AngularJS学习笔记(3)——通过Ajax获取JSON数据

通过Ajax获取JSON数据 以我之前写的与用户交互的动态清单列表为例,使用JSON前todo.html代码如下: <!DOCTYPE html> <html ng-app="todoApp"> <head> <meta charset="UTF-8"> <title>TO DO List</title> <link href="./bootstrap/css/bootstrap