Динамические представления из файла JSON

#reactjs #react-native

#reactjs #react-native

Вопрос:

Я пытаюсь создавать представления из JSON!когда я использую свой массив состояний для отображения каждого элемента в функции render (), он печатает последний индексированный элемент, как я могу перебирать свой массив состояний. Вот мой код для достижения этой цели!

 import React, { Component } from "react";
import { View, TextInput, Button, StyleSheet, Text } from "react-native";
const data = require("../json/data.json");

class InfoScreen extends Component {
  constructor(props) {
    super(props);
    this.state = {
      itemstorender: [],
    };
  }

  componentDidMount() {
    this.renderData();
  }

  renderData = () => {
    const { id } = this.props.route.params;
    const result = data.info[id].child;
    // console.log(result);
    for (var i = 0; i < result.length; i  ) {
      if (result[i].type == "text") {
        this.setState({
          itemstorender: <TextInput key={result.key} placeholder={result[i].label} />
        
        });
      } else if (result[i].type == "button") {
        this.setState({
          itemstorender: <Button key={result.key} title={result[i].label} />,
        });
      }
    }
  };


}

export default InfoScreen;


  

моя функция render()!

  render() {
    return (
        <View>
            { this.state.itemstorender }
        </View>
    )
}
  

Ответ №1:

Это может помочь

 renderData = () => {
    const { id } = this.props.route.params;
    const result = data.info[id].child;
    // console.log(result);
    var itemstorenderLocal = [];
    for (var i = 0; i < result.length; i  ) {
      
     if (result[i].type == "text") {
        itemstorenderLocal.push(<TextInput key={result.key} placeholder={result[i].label} />);
      } else if (result[i].type == "button") {
        itemstorenderLocal.push(<Button key={result.key} title={result[i].label} />);
      }
    }
    
    this.setState({
       itemstorender: itemstorenderLocal
    });

  };
  

Комментарии:

1. Спасибо, чувак, это сработало отлично.. я хочу спросить вас еще об одной вещи, связанной с этим.

2. Да, конечно, пожалуйста, спросите

3. как я могу получить значения из каждого элемента? элементы могут быть разных типов. например, переключатель, счетчик, флажок и т. Д.