resactj의 렌더와 반환의 차이점은 무엇입니까?

resactj의 렌더와 반환의 차이점은 무엇입니까?

JavaScript는 처음입니다.나는 많은 곳을 본다.return그리고.render어떤 차이가 있는지 알고 싶을 뿐이죠

render메서드는 클래스 메서드로 사용하여 React 컴포넌트를 작성할 때 필요합니다.

문서에 따르면:

그render()메서드가 필요합니다.

호출 시 검사해야 합니다.this.props그리고.this.state다음 중 하나의 유형을 반환합니다.

요소를 반응시키다.일반적으로 JSX를 통해 생성됩니다.요소는 네이티브 DOM 컴포넌트의 표현일 수 있습니다.(<div />)또는 사용자 정의 복합 컴포넌트(<MyComponent />).

문자열과 숫자이러한 노드는 DOM에서 텍스트노드로 렌더링 됩니다.

포털작성처:ReactDOM.createPortal. null 아무것도 렌더링하지 않습니다.

불란스.아무것도 렌더링하지 않습니다.(대부분은 리턴 테스트&& 패턴을 지원하기 위해 존재합니다.여기서 test는 boolean입니다.)

렌더링은 기본적으로 컴포넌트를 업데이트해야 할 때마다 호출되는 라이프 사이클 메서드의 일종입니다.

에 대해서는return스테이트먼트, 이 스테이트먼트를 반환하기 위해 사용됩니다.data/response/JSX elements사용처에 따라 달라집니다.렌더 메서드에 사용되는 경우 위에서 지정한 유형 중 하나를 반환해야 합니다(React 요소, 문자열 및 숫자, Portals 또는 Booleans).

return다른 함수로부터 평가된 값을 반환할 수 있습니다.return에서 렌더링되는 리액트 요소render방법

Functional components정의하지 않다render메서드를 사용하여 React 요소를 반환합니다.explicit return statement또는implicit return

예: 명시적 반환

const Welcome = (props) => {
  return <h1>Hello, {props.name}</h1>;
}

예: 암묵적인 반환

const Welcome = (props) => (
     <h1>Hello, {props.name}</h1>;
)

최신 버전(v16) 이전의 React에서는 대부분의 React 구성 요소가 클래스 기반이었습니다.클래스 베이스 컴포넌트에서는render()메서드 및 그 후return필요한 JSX(javascript mix와 같은html)를 지정합니다.React 16+의 업데이트와 함께, Relect 16+가 없는 기능적 컴포넌트의 사용이 증가하고 있습니다.render()메서드 대신 JSX를 직접 반환합니다.예를 들어 기능 컴포넌트의 구문은 다음과 같습니다.

const NewComponent = (props) => {
   return (
           <div>
               <h1>Title</h1>
           </div>
    )
}

또는 다음과 같은 반환문을 사용하지 않고 기능 컴포넌트로 JSX를 암묵적으로 반환할 수 있습니다.

const NewComponent = (props) => (
   <div>
       <h1>Title</h1>
   </div>
)

두 가지 모두 다음과 같은 클래스 기반 컴포넌트와 동일합니다.

class NewComponent extends React.Component {
    render() {
        return (
            <div>
               <h1>Title</h1>
            </div>
        )
    }
}

자세한 것은, https://reactjs.org/docs/components-and-props.html 를 참조해 주세요.

렌더링은 실제로 컴포넌트에서 호출되는 것이며 반환은 "렌더링"된 것입니다.렌더에서 로그 기록, 변수 설정, 조건부 렌더링 등을 할 수 있지만 실제 출력은 return입니다.

render() {
console.log("Test")
const test = "test"
  return(
    <h1>Hi</h1>
  )
}

return과 render는 다릅니다.render는 반응 방식입니다.return은 출력 반환을 위한 순수 javascript입니다.복잡할 것 없어

반응에서 렌더는 반응에서 표시할 내용을 지시하는 방법입니다.메서드 또는 함수의 반환은 메서드 또는 함수의 출력입니다.

render()는 구기 시작 전 워밍업 및 계획 문구입니다.모든 사람이 무슨 일이 일어날지 알고 있으며, 그 후 복귀하는 플레이어가 실제로 렌더링()이 해야 할 일을 하는 것입니다.

렌더는 표시할 리액션을 지시하는 메서드입니다.

Return은 메서드/함수의 출력을 제공합니다.

"렌더 메서드는 DOM이 어떻게 보여야 하는지에 대한 설명을 반환하고 React는 실제 DOM을 일치하도록 효율적으로 업데이트합니다."

그 차이를 알기 위한 최선의 예에 대해서는, 다음의 링크를 참조해 주세요.https://quickleft.com/blog/understanding-the-difference-between-react-elements-and-components/

렌더링을 여러 번 트리거할 수 있습니다.

반환은 표시하려는 것입니다.

예를들면.

렌더(){

let cardDisplay=여러 번 트리거할 임의의 텍스트(예: 회사 직원 이름 표시)}

돌아가다

( { card Display } )

설명:company.so에서 직원 목록을 표시하려는 경우 트리거(예:)할 변수를 반환합니다.렌더 안에 반복할 논리를 적습니다.

언급URL : https://stackoverflow.com/questions/49078679/what-is-the-difference-between-render-and-return-in-reactjs