React Native element виден / доступен только после нажатия кнопки - PullRequest
0 голосов
/ 21 января 2020

Новый для React Native, имеющий go идею приложения. По сути, я просто пытаюсь создать элемент TextInput, который появляется при нажатии кнопки. Ниже моя попытка. Я пытаюсь воспользоваться состоянием в моем классе, но что-то не так.

Экспо выдает ошибку 'null не является объектом (оценка' this.state.isShowingText ')'.

Есть идеи?

import React, { Component } from 'react';
import { TextInput, Alert, Button, ScrollView, Text, View, StyleSheet } from 'react-native';

export default class CoolComponent extends Component {
  render() {
    const nameAdd = () =>{
      state = { isShowingText: true };
    }
    return (
      <View style={{ alignItems: 'center', top: 50 }}>
        <Title>Some Title</Title>
        {this.state.isShowingText ? <TextInput></TextInput> : null}
        <ScrollView></ScrollView>
        <Button
          title="Press me"
          onPress={nameAdd}
        />
      </View>
    );
  }
}

1 Ответ

2 голосов
/ 21 января 2020

То, как вы обращаетесь с state, неверно

import React, { Component } from 'react';
import { TextInput, Button, ScrollView, View } from 'react-native';

export default class CoolComponent extends Component {
    state = {
        isShowingText: false
    }

    nameAdd = () => {
        this.setState({
            isShowingText: true
        })
    }

    render() {
        return (
            <View style={{ alignItems: 'center', top: 50 }}>
                {this.state.isShowingText ? <TextInput style={{ width: '50', height: '50', borderWidth: 1 }}></TextInput> : null}
                <ScrollView></ScrollView>
                <Button
                    title="Press me"
                    onPress={this.nameAdd}
                />
            </View>
        );
    }
}

Надеюсь, это вам поможет. Не стесняйтесь сомнений.

...