Переменная не определена, когда она?

Итак, немного контекста: он извлекает локальную ссылку на изображение из firebase, затем предполагается, что при нажатии на маркер устанавливается установленное изображение на странице, значения изображения работают для маркеров, но установленное в представлении вне возврата не работает говоря, что это неопределенная переменная, также журнал консоли также показывает правильное значение. Я удалил все ненужные части кода, чтобы он выглядел как можно более легко читаемым.

export class HomeScreen extends Component {
  constructor(props) {
    super(props);

    this.state = {
      image: '',
    };
  }

  render() {
    return (
      <View style = {styles.container}>
        <MapView>
          {this.state.data.map((obj, index) => {
            return (
              <MapView.Marker
                key = {index}
                onPress = {() => {
                  this.setState({ image: obj.image });
                  let { value } = 'require(' + obj.image + ')';
                  console.info(value);
                }}>
                <Image source = {require(obj.image)} style = {styles.pet} />
              </MapView.Marker>
            );
          })}
        </MapView>

        <View style = {styles.petinfo}>
          <Image style = {styles.locpetimg} source = {value} />
        </View>
      </View>
    );
  }
}

export default withNavigation(HomeScreen);

Какая переменная предположительно undefined? Откуда в вашем коде эта ошибка?

— 19.06.2019 09:12

что это this.state.data? никогда не увидите, как вы объявляете или назначаете какой-либо массив

— 19.06.2019 09:12

Переменная стоимость возвращает значение undefined при попытке установить исходное изображение, все остальное работает нормально. Я удалил ненужный код, потому что это довольно большой компонент.

— 19.06.2019 09:13

Не рекомендуется использовать функции стрелок для событий в разделе render(). Каждый рендер будет создавать новую функцию.

— 19.06.2019 09:14

Вы пытаетесь использовать «значение», установленное с помощью «onPress» внутри <Image/> ?? это невозможно, так как это выходит за рамки

— 19.06.2019 09:36

javascript reactjs react-native expo

19.06.2019 09:10

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

export class HomeScreen extends Component {
  constructor(props) {
    super(props);

    this.state = {
      image: '',
      data:[]
    };
  }

  render() {
    return (
      <View style = {styles.container}>
        <MapView>
          {this.state.data.map((obj, index) => {
            return (
              <MapView.Marker
                key = {index}
                onPress = {() => {
                  this.setState({ image: obj.image });
                  let { value } = 'require(' + obj.image + ')';
                  console.info(value);
                }}>
                <Image source = {require(obj.image)} style = {styles.pet} />
              </MapView.Marker>
            );
          })}
        </MapView>

        <View style = {styles.petinfo}>
          <Image style = {styles.locpetimg} source = {value} />
        </View>
      </View>
    );
  }
}

export default withNavigation(HomeScreen);

19.06.2019 09:38

Ответ принят как подходящий

Вы пытаетесь использовать «значение», установленное с «onPress» внутри <Image/> ?? это невозможно, так как это выходит за рамки. попробуйте что-то вроде

export class HomeScreen extends Component {
  constructor(props) {
    super(props);
    this.value = null;
    this.state = {
      image: '',
    };
  }

  render() {
    return (
      <View style = {styles.container}>
        <MapView>
          {this.state.data.map((obj, index) => {
            return (
              <MapView.Marker
                key = {index}
                onPress = {() => {
                  this.setState({ image: obj.image });
                  this.value = 'require(' + obj.image + ')';
                  console.info(value);
                }}>
                <Image source = {require(obj.image)} style = {styles.pet} />
              </MapView.Marker>
            );
          })}
        </MapView>

        <View style = {styles.petinfo}>
          <Image style = {styles.locpetimg} source = {this.value} />
        </View>
      </View>
    );
  }
}

export default withNavigation(HomeScreen);

Здесь я сохраняю значение в переменной-члене класса, а затем использую его.

19.06.2019 09:38