AJAX、fetch、HttpUrlConnection以及多线程

AJAX

<script>
    $(function () {
        // 开始写 jQuery 代码...
        var myHtml = '<table border="1 solid red"><tr><td>ID</td><td>影片</td><td>票房</td></tr>';
        $.ajax({
            url:'test',//url地址
            data:null,//数据
            type:'POST',//访问类型
            dataType:'JSON',//返回数据类型数据
//成功时事件
            success:function (myson) {
                $(myson).each(  function (index,film) {
                   myHtml = myHtml + "<tr><td>"+film.id+"</td><td>"+film.filmName+"</td><td>"+film.boxOfficeStr+"</td></tr>";
                });
                myHtml = myHtml + "</table>";
                $('#mydiv').html(  myHtml  );
            },
//失败时事件
            error:function (err) {
                alert('服务器繁忙'+err);
            },
            timeout:3000
        });
    });

 

fetch

react

 fetch('/test',{
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            // body: JSON.stringify({})
        })
            .then(response => response.json())
            .then(data =>{
               /* alert(data)*/
                this.setState({filmlist:data});
            })
            .catch(
                error =>alert("2345678"+error)
            );

 

遍历输出到界面

 {
                    this.state.filmlist.map((myjson)=>{
                        return <tr><td>{myjson.id}</td><td>{myjson.filmName}</td><td>{myjson.boxOfficeStr}</td></tr>
                    })
                }

react-native

 fetch("http://169.254.230.118:8080/test",
          {
              method: "post",
              mode: 'cors',
              headers: {
                  "Content-Type": "application/json"
              },
              // body: JSON.stringify({})

          })
          .then(response => response.json())
          .then(mydate => {
              this.setState({
                  filmList:mydate
               })
          })
          .catch(
              (err)=>{
            alert(err)
          })

遍历输出大Android页面

  <FlatList
         renderItem={this._renderItem}
         data={this.state.filmList}
         ItemSeparatorComponent{this._itemSeparatorComponent}
         keyExtractor={this._keyExtractor}
  />
//-------------------
_itemSeparatorComponent=()=>{
        return(
            <View style={{height:1,backgroundColor: "#5f5f5f"}}></View>
        )
    }
    _renderItem = ({item}) => {
        return(
            <View style={{flexDirection:"row",backgroundColor:"#fefefe"}}>
                <View style={styles.eachView}><Text>{item.id}</Text></View>
                <View style={styles.eachView}><Text>{item.filmName}</Text></View>
                <View style={styles.eachView}><Text>{item.boxOfficeStr}</Text></View>
            </View>
        )
    }
        _keyExtractor = (item, index) => item.id.toString();

HttpUrlConnection

多线程