Текст / Вид не прячется в реакции - PullRequest
0 голосов
/ 06 февраля 2019

Я пытаюсь скрыть текст / представление, основываясь на значении флага в моем реактиве.Но это не скрывается.

Вот мой код

Файл Class.js

     componentDidMount() {
        this.setState({
          isHidden: true
        });
      }

      constructor(props) {
        super(props);
        this.state = {
          isHidden: false,
    };
      }

render() {
    console.log('renderer');
    const { isHidden } = this.state;
        return (
          <View style={styles.container}>
            <View style={styles.container}>
              //some other objects showing
                  <Text style={styles.Text} hide={isHidden}>
                    Date is Jan 02
                  </Text>
                //some other objects showing
                  <Text style={styles.Text} hide={isHidden}>
              </View>
              </View>
            );
          }
        }

Но это не скрывает даже значение флагаправда.Я что-то здесь упускаю?

Ответы [ 3 ]

0 голосов
/ 06 февраля 2019

Попробуйте, если это поможет.У React нет атрибута hide, поэтому вам необходимо условно отобразить текстовое поле на основе переменной isHidden

 (!isHidden)?<Text style={styles.Text}>Date is Jan 02</Text>: ''
0 голосов
/ 06 февраля 2019

React-Native Текст не имеет скрытой опоры.Вы можете получить желаемый эффект следующим образом {!this.state.isHidden}<Text>....</Text>

Я посмотрел на ваш код и у меня есть несколько замечаний.

Рекомендуется всегда Prevent usage of setState in componentDidMount (no-did-mount-set-state).Вызов setState () в этом методе вызовет дополнительный рендеринг, но он гарантированно сбрасывается во время того же тика.Это гарантирует, что даже при том, что render () будет вызываться дважды в этом случае, пользователь не увидит промежуточное состояние.

Таким образом, он не вызывает видимых побочных эффектов.

Используйте этот шаблон с осторожностью, поскольку он часто вызывает проблемы с производительностью.Так что, если вы не делаете server-rendering, все, что требует среды браузера , должно идти в componentDidMount, так как это работает только для клиента, но componentWillMount работает как на клиенте, так и на сервере.

0 голосов
/ 06 февраля 2019

Я не являюсь разработчиком React Native, однако из документации компонент Text не имеет hide проп.Если бы вы подходили к этому со стандартной точки зрения React, вы бы либо добавили соответствующую функциональность к вашему компоненту (что, я полагаю, вы не можете сделать), либо изменили метод визуализации:

class Test extends Component {
    render() {
        return (
            {!this.state.isHidden && <Text style={styles.text}>Exciting copy...</Text>}
        )
    }
}
...