if-else 문을 사용하지 않고 ReactJS에서 조건부 렌더링을 구현하는 방법은 무엇입니까?

ReactJS의 조건부 렌더링: JSX의 if-else 문

ReactJS에서 if-else 문은 JSX 표현식 내에서 직접 사용할 수 없습니다. . 이는 JavaScript 함수 호출 및 개체를 생성하기 위한 구문 설탕인 JSX의 특성 때문입니다.

상태에 따라 요소를 조건부로 렌더링하려면 다음과 같은 대체 접근 방식이 있습니다.

삼항 연산자:

아래와 같이 삼항 연산자를 사용하여 조건을 평가하고 결과에 따라 다양한 요소를 렌더링합니다. 아래:

render() {
    return (   
        <View>

함수 호출:

if-else 논리를 평가하고 적절한 요소를 반환하는 함수를 만듭니다. 그런 다음 JSX 표현식 내에서 함수를 호출합니다.

renderElement(){
   if(this.state.value == 'news')
      return data;
   return null;
}

render() {
    return (   
        <View>

삼항 연산자 또는 함수 호출을 활용하면 장면을 수정하거나 탭을 사용하지 않고도 ReactJS에서 요소를 조건부로 렌더링할 수 있습니다.

위 내용은 if-else 문을 사용하지 않고 ReactJS에서 조건부 렌더링을 구현하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!