React Hook: метод отображает JSX бесконечно - PullRequest
Новая
       35

React Hook: метод отображает JSX бесконечно

0 голосов
/ 24 апреля 2020

Здесь вы можете увидеть упрощенную версию моей проблемы: 

class Test extends Component {
  state = { text: 'Hello World' };
  rendersomeJSX = () => <Text>{this.props.someValueThatChangesOverTime}</Text>;

  render() {
    return <View>{this.rendersomeJSX()}</View>;
  }
}

Я пытаюсь реализовать то же поведение, используя React Hook: 

function useTest(props) {
  const [text, setText] = useState('Hello World');
  function rendersomeJSX() {
    return <Text>{props.someValueThatChangesOverTime}</Text>;
  }
  return <View>{rendersomeJSX()}</View>;
}

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

Как правильно использовать функцию, которая создает некоторый раздел пользовательского интерфейса и возвращает его?

1 Ответ

2 голосов
/ 24 апреля 2020

Как насчет этого? 

import React, { useState, useMemo } from 'react';

function useTest() {
  const [text, setText] = useState('Hello World');
  const someJSX = useMemo(() {
    return <Text>{text}</Text>;
  }, [text]);
  return <View>{someJSX}</View>;
}
...