React의 다른 구성 요소에서 변수를 어떻게 읽을 수 있습니까?

Agustin Rodrigues

React를 사용하는 컴포넌트의 두 옵션 요소에서이 두 값을받습니다. 질문 : 다른 구성 요소에서이 두 변수를 어떻게 읽을 수 있습니까?

const handleInputChange = (e) => {   
    const valueFilterActive = document.getElementById("activeFilter").value;
    const valueFilterName = document.getElementById("bussFilter").value;
    alert(valueFilterName+valueFilterActive);   
 };

두 번째 구성 요소 코드 줄 :

 return (
    <> 
      <div className="col-md-4 p-2">
        <FirstComponent/>
  
      </div>
      <div className="col-md-8 p-1 ">
          <div className={ valueFilterActive  === 'Activado' ? "text-success" : "text-primary card mb-1"} key={link.id}>

고마워요 !!!

Klopo Cz

다른 구성 요소에서 변수를 읽으려면 여러 가지 방법을 사용할 수 있습니다. 이러한 구성 요소를 연결하는 방법에 따라 다릅니다.

기본 값이 상위에 있고 하위에 전달하려는 경우 소품 사용 https://reactjs.org/docs/components-and-props.html

const element = <Welcome data1 ={valueFilterActive} data2 ={valueFilterName} />;

function Welcome(props) {  
return <h1>Hello, {props.valueFilterName} {props.valueFilterActive}</h1>;
}

기본 값이 자식이고 부모에게 전달하려는 경우 콜백 함수 https://reactjs.org/docs/faq-functions.html

하지만 더 복잡한 방법이라면 Context Hook https://reactjs.org/docs/hooks-reference.html#usecontext 사용을 권장합니다.

(추신 : 또한 반응에서 getElementByIduseRef https://reactjs.org/docs/hooks-reference.html#useref 라는 또 다른 후크를 사용하지 않습니다 )

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

React에서 다른 구성 요소의 인증 상태를 어떻게 동기화 할 수 있습니까?

분류에서Dev

React에서 부모가 다른 구성 요소의 prop 또는 state 값을 프로그래밍 방식으로 어떻게 변경할 수 있습니까?

분류에서Dev

React-다른 js 파일의 한 구성 요소에서 다른 구성 요소로 API 데이터를 어떻게 전달할 수 있습니까?

분류에서Dev

React Native에서 텍스트 구성 요소의 줄 수를 어떻게 얻을 수 있습니까?

분류에서Dev

변수의 요소에서 속성을 어떻게 얻을 수 있습니까?

분류에서Dev

변수의 값을 React 구성 요소에 어떻게 전달할 수 있습니까?

분류에서Dev

여러 다른 구성 요소에서 단일 React 구성 요소를 어떻게 업데이트 할 수 있습니까?

분류에서Dev

React Native에서 다른 구성 요소의 함수를 어떻게 호출합니까?

분류에서Dev

Angular 8에서 다른 구성 요소로 이동 한 후 구성 요소의 상태를 어떻게 저장할 수 있습니까?

분류에서Dev

eventHandler에서 React의 특정 구성 요소를 어떻게 변경할 수 있습니까?

분류에서Dev

Angular 4의 자식 구성 요소에서 다른 자식 구성 요소로 어떻게 액세스 할 수 있습니까?

분류에서Dev

가는 구성 요소의 속성 값을 어떻게 읽을 수 있습니까?

분류에서Dev

다른 함수에서 변수를 어떻게 읽습니까?

분류에서Dev

Android의 parcelable은 생성자에서 읽을 변수를 어떻게 알 수 있습니까?

분류에서Dev

VS Code의 오른쪽 상단에있는 구성 요소는 무엇입니까? 설정을 어떻게 변경할 수 있습니까?

분류에서Dev

Blazor의 자식 구성 요소에 List <string>을 매개 변수로 어떻게 전달할 수 있습니까?

분류에서Dev

Postgres의 json 변수에서 키를 어떻게 읽을 수 있습니까?

분류에서Dev

프로토콜 정의에서 하나의 Swift typealias를 다른 유형으로 제한 할 수 있습니까? 그렇지 않은 경우 구성 요소 등록과 같은 것을 어떻게 얻을 수 있습니까?

분류에서Dev

다른 함수에서 어떻게 변수를 얻을 수 있습니까?

분류에서Dev

앵귤러 2에서 모달을 별도의 구성 요소로 어떻게 만들 수 있습니까?

분류에서Dev

react Link에서 매개 변수를 사용하고 다른 구성 요소에서 그 값을 얻습니까?

분류에서Dev

Vue 구성 요소에서 Bootstrap을 어떻게 사용할 수 있습니까?

분류에서Dev

C #에서 XML 문서의 속성을 어떻게 읽을 수 있습니까?

분류에서Dev

Installshield에서 레지스트리 키의 구성 요소를 어떻게 변경할 수 있습니까?

분류에서Dev

정의되지 않은 속성 변수를 읽을 수 없습니다. 실수는 어디에 있습니까?

분류에서Dev

다른 구성 요소에서 mixin 함수를 어떻게 호출합니까?

분류에서Dev

함수 구성 요소 내의 함수에서 react-router의 Link와 동일한 동작을 어떻게 사용할 수 있습니까?

분류에서Dev

JavaFX의 다른 컨트롤러에서 (panel, anchorpane)과 같은 구성 요소를 어떻게 사용할 수 있습니까?

분류에서Dev

Vue 2의 부모 구성 요소에서 자식 구성 요소의 감시자의 업데이트 값을 어떻게 얻을 수 있습니까?

Related 관련 기사

  1. 1

    React에서 다른 구성 요소의 인증 상태를 어떻게 동기화 할 수 있습니까?

  2. 2

    React에서 부모가 다른 구성 요소의 prop 또는 state 값을 프로그래밍 방식으로 어떻게 변경할 수 있습니까?

  3. 3

    React-다른 js 파일의 한 구성 요소에서 다른 구성 요소로 API 데이터를 어떻게 전달할 수 있습니까?

  4. 4

    React Native에서 텍스트 구성 요소의 줄 수를 어떻게 얻을 수 있습니까?

  5. 5

    변수의 요소에서 속성을 어떻게 얻을 수 있습니까?

  6. 6

    변수의 값을 React 구성 요소에 어떻게 전달할 수 있습니까?

  7. 7

    여러 다른 구성 요소에서 단일 React 구성 요소를 어떻게 업데이트 할 수 있습니까?

  8. 8

    React Native에서 다른 구성 요소의 함수를 어떻게 호출합니까?

  9. 9

    Angular 8에서 다른 구성 요소로 이동 한 후 구성 요소의 상태를 어떻게 저장할 수 있습니까?

  10. 10

    eventHandler에서 React의 특정 구성 요소를 어떻게 변경할 수 있습니까?

  11. 11

    Angular 4의 자식 구성 요소에서 다른 자식 구성 요소로 어떻게 액세스 할 수 있습니까?

  12. 12

    가는 구성 요소의 속성 값을 어떻게 읽을 수 있습니까?

  13. 13

    다른 함수에서 변수를 어떻게 읽습니까?

  14. 14

    Android의 parcelable은 생성자에서 읽을 변수를 어떻게 알 수 있습니까?

  15. 15

    VS Code의 오른쪽 상단에있는 구성 요소는 무엇입니까? 설정을 어떻게 변경할 수 있습니까?

  16. 16

    Blazor의 자식 구성 요소에 List <string>을 매개 변수로 어떻게 전달할 수 있습니까?

  17. 17

    Postgres의 json 변수에서 키를 어떻게 읽을 수 있습니까?

  18. 18

    프로토콜 정의에서 하나의 Swift typealias를 다른 유형으로 제한 할 수 있습니까? 그렇지 않은 경우 구성 요소 등록과 같은 것을 어떻게 얻을 수 있습니까?

  19. 19

    다른 함수에서 어떻게 변수를 얻을 수 있습니까?

  20. 20

    앵귤러 2에서 모달을 별도의 구성 요소로 어떻게 만들 수 있습니까?

  21. 21

    react Link에서 매개 변수를 사용하고 다른 구성 요소에서 그 값을 얻습니까?

  22. 22

    Vue 구성 요소에서 Bootstrap을 어떻게 사용할 수 있습니까?

  23. 23

    C #에서 XML 문서의 속성을 어떻게 읽을 수 있습니까?

  24. 24

    Installshield에서 레지스트리 키의 구성 요소를 어떻게 변경할 수 있습니까?

  25. 25

    정의되지 않은 속성 변수를 읽을 수 없습니다. 실수는 어디에 있습니까?

  26. 26

    다른 구성 요소에서 mixin 함수를 어떻게 호출합니까?

  27. 27

    함수 구성 요소 내의 함수에서 react-router의 Link와 동일한 동작을 어떻게 사용할 수 있습니까?

  28. 28

    JavaFX의 다른 컨트롤러에서 (panel, anchorpane)과 같은 구성 요소를 어떻게 사용할 수 있습니까?

  29. 29

    Vue 2의 부모 구성 요소에서 자식 구성 요소의 감시자의 업데이트 값을 어떻게 얻을 수 있습니까?

뜨겁다태그

보관