Как я могу получить значение из this.state.name внутри функции? Работает в рендере, но не внутри функции - PullRequest
1 голос
/ 12 октября 2019

Здравствуйте, мне было интересно, почему this.state.name работает внутри рендера, но не внутри функции. Значение не определено, если я использую его внутри функции

  whichName = () => {
    console.log("NAME: " + this.state.name);
  };

А внутри рендера это работает?

{this.state.name}

Почему это не работает внутри функции? (Не определено или пусто)

Я начинающий, извините, если это глупый вопрос.

Спасибо за ваше время

РЕДАКТИРОВАТЬ

import React from "react";
import {
  StyleSheet,
  Text,
  View
} from "react-native";


export default class Account extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
    };
  }



  componentDidMount() {
   this.fetchData();
  }

catchName() {
console.log(this.state.name);
///RETURNS UNDEFINED
}

  render() {
    return (
      <View>
RETURNS NAME
       <Text>{this.state.name}</Text>
      </View>
    );
  }

  fetchData = async () => {
    const savedId = await AsyncStorage.getItem("savedId");

    fetch("http://192.168.1.16:3434/loadAccount?id=" + savedId)
      .then(response => response.json())
      .then(res => {
        if (res.success === true) {
          this.setState({
            name: res.firstName,
          });
        } else {
          alert(res.message);
        }
      })
      .catch(error => {
        console.error(error);
      });
  };

1 Ответ

0 голосов
/ 12 октября 2019

У вас есть переменная состояния с именем, и она должна иметь какое-то значение

, см. Код ниже для справки

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

class Blink extends Component {

  componentDidMount(){
    // Toggle the state every second
    setInterval(() => (
      this.setState(previousState => (
        { isShowingText: !previousState.isShowingText }
      ))
    ), 7000);
  }

  checkState = () => {
    alert(this.state.name);
  }
  //state object
  state = { isShowingText: true ,name:'vignesh'};

  render() {
    if (!this.state.isShowingText) {
      return null;
    }

    return (
      <Text onPress={this.checkState}>{this.props.text}</Text>
    );
  }
}

export default class BlinkApp extends Component {
  render() {
    return (
      <View>
        <Blink  text='I love to blink' />
        <Blink text='Yes blinking is so great' />
        <Blink text='Why did they ever take this out of HTML' />
        <Blink  text='Look at me look at me look at me' />
      </View>
    );
  }
}
...