«reactjs» 태그된 질문

React (React.js 또는 ReactJS라고도 함)는 사용자 인터페이스를 구축하기 위해 Facebook에서 개발 한 JavaScript 라이브러리입니다. 선언적이고 구성 요소 기반의 패러다임을 사용하며 효율적이고 유연합니다.

7
React는 클릭시 중첩 된 구성 요소에서 이벤트 버블 링을 방지합니다.
다음은 기본 구성 요소입니다. <ul>및 둘 다 <li>onClick 기능이 있습니다. 나는 onClick 만 <li>발사하고 <ul>. 이것을 어떻게 할 수 있습니까? 나는 e.preventDefault (), e.stopPropagation ()을 가지고 놀았습니다. class List extends React.Component { constructor(props) { super(props); } handleClick() { // do something } render() { return ( <ul onClick={(e) => { …

6
경고 : 알 수없는 DOM 속성 클래스입니다. className을 의미 했습니까?
방금 간단한 렌더링 기능이있는 구성 요소를 추가하여 React를 탐색하기 시작했습니다. render() { return <div class="myApp"></div> } 앱을 실행할 때 다음과 같은 오류가 발생합니다. Warning: Unknown DOM property class. Did you mean className? 나는 변경하여이 문제를 해결 할 수 있습니다 class로 className. 질문은 ~이야; React는이 규칙을 시행합니까? 또한 왜 className기존 대신 …

7
React Router의 동일한 구성 요소에 대한 여러 경로 이름
세 가지 경로에 동일한 구성 요소를 사용하고 있습니다. <Router> <Route path="/home" component={Home} /> <Route path="/users" component={Home} /> <Route path="/widgets" component={Home} /> </Router> 어쨌든 그것을 결합하여 다음과 같이 할 수 있습니까? <Router> <Route path=["/home", "/users", "/widgets"] component={Home} /> </Router>

10
React에서 추가 래핑 <div>를 피하는 방법은 무엇입니까?
오늘 저는 ReactJS를 배우기 시작했고 한 시간 후에 문제에 직면했습니다. 페이지의 div 안에 두 개의 행이있는 구성 요소를 삽입하고 싶습니다. 아래에서 수행하는 간단한 예제입니다. html이 있습니다. &lt;html&gt; .. &lt;div id="component-placeholder"&gt;&lt;/div&gt; .. &lt;/html&gt; 다음과 같은 렌더링 기능 : ... render: function() { return( &lt;div className="DeadSimpleComponent"&gt; &lt;div className="DeadSimpleComponent__time"&gt;10:23:12&lt;/div &gt; &lt;div className="DeadSimpleComponent__date"&gt;MONDAY, 2 …

13
React-Router 외부 링크
react-router를 사용하여 반응 앱에서 내 경로를 처리하고 있기 때문에 외부 리소스로 리디렉션하는 방법이 있는지 궁금합니다. 누군가가 맞았다 고 말하십시오. example.com/privacy-policy 다음으로 리디렉션하고 싶습니다. example.zendesk.com/hc/en-us/articles/123456789-Privacy-Policies 내 index.html에서 일반 JS로 작성하는 것을 피하는 데 정확히 도움이되지 않습니다. if ( window.location.path === "privacy-policy" ){ window.location = "example.zendesk.com/hc/en-us/articles/123456789-Privacy-Policies" }

9
react-router 해시 조각에서 쿼리 매개 변수 가져 오기
클라이언트 측에서 내 응용 프로그램에 react 및 react-router를 사용하고 있습니다. 다음과 같은 URL에서 다음 쿼리 매개 변수를 가져 오는 방법을 알아낼 수없는 것 같습니다. http://xmen.database/search#/?status=APPROVED&amp;page=1&amp;limit=20 내 경로는 다음과 같습니다 (내가 아는 경로는 완전히 잘못되었습니다). var routes = ( &lt;Route&gt; &lt;DefaultRoute handler={SearchDisplay}/&gt; &lt;Route name="search" path="?status=:status&amp;page=:page&amp;limit=:limit" handler={SearchDisplay}/&gt; &lt;Route name="xmen" path="candidate/:accountId" handler={XmenDisplay}/&gt; &lt;/Route&gt; …

10
react js에서 onchange 이벤트를 트리거하는 가장 좋은 방법은 무엇입니까?
Backbone + ReactJS 번들을 사용하여 클라이언트 측 앱을 빌드합니다. 악명 높은 것에 크게 의존하여 valueLink양방향 바인딩을 위해 ReactJS 인터페이스를 지원하는 자체 래퍼를 통해 모델에 직접 값을 전파합니다. 이제 우리는 문제에 직면했습니다. 우리는이 jquery.mask.js프로그램 따라서 화재 이벤트를 반응하지 않는 입력 값의 형식을 플러그인. 이 모든 것이 모델이 사용자 입력에서 형식화되지 않은 …
112 reactjs 

7
해당 이름의 작업이 이미 존재하므로 작업 '래퍼'를 추가 할 수 없습니다.
'react-native init AwesomeProject'를 설치할 때 다음을 실행할 때이 오류가 발생합니다 react-native run-android. Could not determine java version from '11.0.1'. 빠른 Google은 distributionUrlGradle-wrapper에서을 업데이트해야한다고 제안합니다 . 이 작업을 수행하면 새로운 오류가 발생합니다. Cannot add task 'wrapper' as a task with that name already exists. 문제가 파일에 있음을 나타냅니다. /AwesomeProject/android/build.gradle' line: 36 …

5
클래스 기반 컴포넌트에서 React.forwardRef를 사용하는 방법은 무엇입니까?
React.forwardRef를 사용하려고하는데 HOC가 아닌 클래스 기반 구성 요소에서 작동하도록하는 방법에 대해 설명합니다. 문서 예제는 요소와 기능적 구성 요소를 사용하며 심지어 고차 구성 요소의 함수로 클래스를 래핑합니다. 그래서, 같은 것을 시작으로 이 자신의 ref.js파일을 const TextInput = React.forwardRef( (props, ref) =&gt; (&lt;input type="text" placeholder="Hello World" ref={ref} /&gt;) ); 대신 다음과 같이 …

21
반응 라우터는 모든 전환에서 맨 위로 스크롤합니다.
다른 페이지로 이동할 때 문제가 있습니다. 그 위치는 이전 페이지와 동일하게 유지됩니다. 따라서 자동으로 맨 위로 스크롤되지 않습니다. 나는 또한 window.scrollTo(0, 0)onChange 라우터 에서 사용하려고했습니다 . 이 문제를 해결하기 위해 scrollBehavior도 사용했지만 작동하지 않았습니다. 이것에 대한 제안이 있습니까?

7
HashRouter 대 BrowserRouter
나는 공식 문서를 읽으면 이해하기가 약간 어려워지는 프로그래밍에 익숙하지 않습니다. 여기에서 React Router 4 에 대해 읽었 습니다. 이 글에서 저자가에 대해 얘기했다 &lt;HashRouter&gt;및&lt;BrowserRouter&gt; 이것이 그가 언급 한 것입니다 HashRouter는 기본적으로 URL의 해시를 사용하여 구성 요소를 렌더링합니다. 정적 한 페이지 웹 사이트를 구축하고 있었기 때문에 이것을 사용해야했습니다. BrowserRouter , HTML5 …
112 reactjs 

6
React 입력 텍스트 필드에 입력 할 수 없습니다.
나는 React.js의 첫 번째 비트를 시도하고 있으며 초기에 난처 해합니다 ... 검색 양식을 &lt;div id="search"&gt;&lt;/div&gt;. 그러나 검색 창에 입력하는 것은 아무것도하지 않습니다. 아마도 소품과 상태를 위아래로 전달하는 것이 누락되고 있으며 이것은 일반적인 문제처럼 보입니다. 그러나 나는 어리둥절합니다. 무엇이 누락되었는지 볼 수 없습니다. var SearchFacet = React.createClass({ handleChange: function() { this.props.onUserInput( …


7
React의 JSX 구문에서 이중 중괄호의 목적은 무엇입니까?
로부터 튜토리얼 react.js 우리는 이중 중괄호의 사용을 참조하십시오 &lt;span dangerouslySetInnerHTML={{ __html: rawMarkup }} /&gt; 그리고 두 번째 튜토리얼 "Thinking in react"에서 : &lt;span style={{ color: 'red' }}&gt; {this.props.product.name} &lt;/span&gt;; 그러나 React JSX 문서 는 이중 중괄호를 설명하거나 언급하지 않습니다. 이 구문 (이중 컬리)은 무엇을위한 것입니까? 그리고 jsx에서 동일한 것을 표현하는 …

1
JSX에서 foreach 반응
REACT를 통해 출력하려는 ​​개체가 있습니다. question = { text: "Is this a good question?", answers: [ "Yes", "No", "I don't know" ] } 내 반응 구성 요소 (줄임)는 또 다른 구성 요소입니다. class QuestionSet extends Component { render(){ &lt;div className="container"&gt; &lt;h1&gt;{this.props.question.text}&lt;/h1&gt; {this.props.question.answers.forEach(answer =&gt; { console.log("Entered"); //This does ifre &lt;Answer answer={answer} …

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.