在React Native中如何设置获取JSON响应数组的特定数组索引到TextInput

Question

我能够在 React Native 中获取我的完整响应代码如下获取数据

import React, { Component } from 'react';
import {
  View,
  Text,
  TouchableOpacity,
  FlatList,
} from 'react-native';


export default class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      dataSource: [],
    }
  }

  componentDidMount() {
    let content = '/LoginPageLoad_Arr';
    const url = 'abc.asmx' + content;
    fetch(url, {
      method: 'POST',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json; charset=utf-8',
      },
    })
      .then((response) => response.json())
      .then((responseJson) => {
        const result = JSON.parse(responseJson.d)

        this.setState({
          dataSource: result.Table1
        })
      }).catch((error) => {
        console.error(error);
      });
  }
  _renderItem = ({ item }) => (
    <TouchableOpacity>
      <View>
        <Text>
          {item.ID} = {item.VALUE}
        </Text>
      </View>
    </TouchableOpacity>
  )
  render() {
    return (
      <View>
        <FlatList
          data={this.state.dataSource}
          renderItem={this._renderItem}
        // keyExtractor={(item, index) => index}
        />
      </View>
    )
  }
}

我关心的是在索引 0 处获取 ID 和 VALUE。我尝试添加代码 item.ID[0] 它只获取所有 ID 的第一个字母。我想在 TextInput 中设置索引 0 处的完整 ID。如果有人正在处理它，请帮助我。

Answer 1

首先，更好的方法是在 ComponentDidMount 中削减你的功能，并使用 async 而不是 .then() 就像：

ComponentDidMount(){
  this.callApiFunction();
}

async callApiFunction(){
  try{
    let content = '/LoginPageLoad_Arr';
      const url = 'abc.asmx' + content;
      const call = await fetch(url, {
        method: 'POST',
        headers: {
          'Accept': 'application/json',
          'Content-Type': 'application/json; charset=utf-8',
        },
      })
        call = call.json();
        call = JSON.parse(call.d)
        //If you want to browse an array, you can use the map function
        call.map((item, index) => {
        //And make condition here, for exemple the first element
        if(index == 0){
            //DO what u want 
            console.log(item)
            this.setState({
            dataSource: item
          })
        }
        
        })
          
        }).catch((error) => {
          console.error(error);
      });
    }
    catch(e){
      console.log(e)
    }
}

希望对您有所帮助

在React Native中如何设置获取JSON响应数组的特定数组索引到TextInput

How do I set get the specific array index of JSON response array to TextInput in React Native

arrays

json

react-native

parsing

itemrenderer