Динамический импорт файла JSON в React-native - PullRequest
0 голосов
/ 03 ноября 2019

Я хочу импортировать файлы JSON динамически в зависимости от определенных условий. Мой код:

import TXT1 from "../Assets/TTCS1.json";
import TXT2 from "../Assets/TTCS2.json";

export class Timetable extends Component {
  state = {class: 1}; 
  render() {
    return this.state.class === 1 ? (
        <View style={styles.container}>
          <Text>{TXT1.S5}</Text>
        </View>
    ) : (
      <View style={styles.container}>
        <Text>{TXT2.S5}</Text>
      </View>
    );
  }
}

Эти JSON-файлы имеют большой размер, и конкретный пользователь в основном будет использовать только любой из JSON-файлов, поэтому импорт всех данных является пустой тратой ресурсов. Я нашел ответ здесь Как я могу условно импортировать модуль ES6? ответ отлично работает с файлами JS, но с файлами JSON я запутался, что нужно поместить в функцию .then ().

1 Ответ

0 голосов
/ 03 ноября 2019

, которые вы можете использовать, требуют.

Создана экспо-закуска:

https://snack.expo.io/BJRqgSnqr

import React, { Component } from 'react';
import { Text, View, StyleSheet, ScrollView } from 'react-native';
import * as Constants from 'expo-constants';

var TXT1='',TXT2='';

export default class App extends Component {

  state={TXT1:'',TXT2:''}

  componentDidMount=()=>
  {

     TXT1  = require('./assets/TXT1.json');
     this.setState({TXT1});
  }

  render() {
    return (
      <View style={styles.container}>
        <Text>{JSON.stringify(this.state.TXT1)}</Text>
        <Text>{JSON.stringify(TXT2)}</Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
    paddingTop: Constants.statusBarHeight,
    backgroundColor: '#ecf0f1',
  },

});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...