Reactnative foundation - 10 (fetch sends network request)

App There is no cross domain problem

Network request ： Default print data , The default display is cmd Command line , You can debug and view the data through the developing mode

Debug mode ： defective , Will report a mistake , Some functions will be abnormal （ The input box cannot get focus 、 Error warning 、 Inaccurate timer ）, Shut down when not in use

How to open the mode in development ：

        1、 stay cmd Server side knock d

        2、 On the simulator client , You can see the pop-up menu

        3、 choice debug

Closing mode of development mode ： ditto

ScrollView： rolling , The displayed data can be scrolled ,View Only one screen can be displayed

fetch send out get Network request ：

const rpx = x => (Dimensions.get('screen').width / 750) * x;
export default class App extends Component {
  url = 'https://api.apiopen.top/getWangYiNews';
  state = {result: []};
  componentDidMount() {
    fetch(this.url)
      .then(res => res.json())
      .then(res => {
        this.setState({result: res.result});
      });
  }
  showNews() {
    return this.state.result.map((item, index) => (
      <View  key={index}>
        <Image source={
   {uri: item.image}}/>
        <View>
          <Text >{item.title}</Text>
          <Text>{item.passtime}</Text>
        </View>
      </View>
    ));
  }
  render() {
    return <ScrollView>{this.showNews()}</ScrollView>;
  }
}

fetch send out post  Network request ：

        fetch( Parameters 1,{ Parameters 2}).then(res=>res.json()).then(res=>{console.log(res)})

         Parameters 1：url

         Parameters 2：method Method 、header Header information 、 Spliced post parameter information

// Verify login 
_dologin = () => {
    const {uname, upwd} = this.state;
    let url = 'http://www….';
    const body = `uname=${uname}&upwd=${upwd}`;
    fetch(url, {
      method: 'POST',
      headers: {'Content-Type': 'application/x-www-form-urlencoded'},
      body,
    })
      .then(res => res.json())
      .then(res => {
         console.log(res)
      });
 };