목록리액트 (10)
스택큐힙리스트
내 구조는 다음과 같습니다: 구성 요소 1 - |- 구성 요소 2 - - |- 구성 요소 4 - - - |- 구성 요소 5 구성 요소 3 구성 요소 3은 구성 요소 5의 상태에 따라 일부 데이터를 표시해야 합니다. 속성(props)은 불변하기 때문에 구성 요소 1에 그 상태를 저장하고 전달하는 것은 간단하지 않습니다. 맞나요? 그리고 네, 저는 Redux 에 대해 읽어보았지만 사용하고 싶지 않습니다. React만으로 문제를 해결할 수 있을 것이라고 기대합니다. 잘못됐을까요?답변 1부모-자식 간의 커뮤니케이션을 위해서는 부모에서 자식으로 상태를 전달하는 함수를 전달해야합니다. 다음과 같이 class Parent extends React.Component { constructor(props) { super(..
ReactJS와 JSX에 새로운 사람입니다. 아래의 코드에 약간의 문제가 있습니다. 각 li에 className 속성에 여러 클래스를 추가하려고 시도하고 있습니다: 내 React 컴포넌트는 다음과 같습니다:var AccountMainMenu = React.createClass({ getInitialState: function() { return { focused: 0 }; }, clicked: function(index) { this.setState({ focused: index }); }, render: function() { var self = this; var accountMenuData = [ { name: 내 계정, icon: 아이콘 계정 }, { name: 메시지, icon: 아이콘 메시지 }..
이 글에서 설명하는 대로, 컴포넌트 외부에서 클릭 이벤트가 발생했는지 감지하는 방법을 찾고 있습니다. 클릭 이벤트의 대상이 부모 요소 중 하나로 DOM 요소를 갖고 있는지 확인하기 위해 jQuery closest()를 사용합니다. 일치하는 경우, 클릭 이벤트는 자식 중 하나에 속하므로 컴포넌트 외부로 간주되지 않습니다. 그래서 내 컴포넌트에는 window에 클릭 핸들러를 추가하고 싶습니다. 핸들러가 실행되면 대상을 내 컴포넌트의 DOM 자식들과 비교해야 합니다. 클릭 이벤트에는 path와 같은 속성이 있는데, 이는 이벤트가 이동한 DOM 경로를 보유하는 것 같습니다. 무엇을 비교해야 할지 또는 어떻게 최상의 방법으로 탐색해야 할지 확신이 없고, 이미 잘 만들어진 유틸리티 함수에 그런 내용이 있을 것 같습..
특정 조건이 충족되었을 때만 리액트 컴포넌트에 속성을 추가하는 방법이 있을까요? 렌더링 이후 Ajax 호출을 기반으로 폼 요소에 required 및 readOnly 속성을 추가해야 하지만, readOnly=false는 속성을 완전히 생략하는 것과 동일하지 않기 때문에 이 문제를 해결할 수 없는 것 같습니다. 아래 예제는 원하는 동작을 설명하려고 했으나 작동하지 않습니다. (구문 오류: 예기치 않은 식별자) function MyInput({isRequired}) { return } 답변 1React는 특정 속성의 경우에 값이 참이 아닐 경우 속성을 생략하는 데에 충분히 지능적입니다. 예를 들어: const InputComponent = function() { const required = true; con..