«reactjs» 태그된 질문

클래스 내부에 구성 요소를 작성하는 대신 함수 구문을 대신 사용하고 싶습니다. 어떻게 오버라이드 (override) 할 componentDidMount, componentWillMount기능 구성 요소 내부에? 가능할까요? const grid = (props) => { console.log(props); let {skuRules} = props; const componentDidMount = () => { if(!props.fetched) { props.fetchRules(); } console.log('mount it!'); }; return( <Content title="Promotions" breadcrumbs={breadcrumbs} fetched={skuRules.fetched}> …

135 reactjs  redux 

저는 현재 React에서 후크 개념을 배우고 있으며 아래 예제를 이해하려고 노력하고 있습니다. import { useState } from 'react'; function Example() { // Declare a new state variable, which we'll call "count" const [count, setCount] = useState(0); return ( <div> <p>You clicked {count} times</p> <button onClick={() => setCount(count + 1)}> Click …

134 javascript  reactjs  react-native  react-hooks 

React hooks는 useState구성 요소 상태를 설정하기 위해 도입 되었습니다. 그러나 후크를 사용하여 아래 코드와 같이 콜백을 대체하려면 어떻게해야합니까? setState( { name: "Michael" }, () => console.log(this.state) ); 상태가 업데이트 된 후에 뭔가를하고 싶습니다. useEffect추가 작업을 수행하는 데 사용할 수 있지만 비트 코드가 필요한 이전 상태 값을 확인해야합니다. useState후크 와 함께 …

134 reactjs 

비슷한 질문이 있지만 여러 기능을 가진 파일을 만들지 못했습니다. 방법이 이미 구식인지 RN이 매우 빠르게 발전하고 있는지 확실하지 않습니다. 반응 네이티브에서 전역 도우미 기능을 만드는 방법은 무엇입니까? 나는 React Native를 처음 사용합니다. 내가하고 싶은 일은 많은 재사용 가능한 함수로 가득 찬 js 파일을 만든 다음 구성 요소에서 가져 와서 호출하는 …

133 reactjs  react-native 

React에서 시차 효과를 만들기 위해 창 스크롤에서 자체 스타일을 업데이트 해야하는 구성 요소를 만들었습니다. 컴포넌트 render메소드는 다음과 같습니다. function() { let style = { transform: 'translateY(0px)' }; window.addEventListener('scroll', (event) => { let scrollTop = event.srcElement.body.scrollTop, itemTranslate = Math.min(0, scrollTop/3 - 60); style.transform = 'translateY(' + itemTranslate + 'px)'); }); return …

133 javascript  reactjs 

Flux 에 대해 읽고 있지만 Todo 앱 예제 는 너무 간단하여 몇 가지 핵심 사항을 이해하기 어렵습니다. 사용자 프로필 페이지 가있는 Facebook과 같은 단일 페이지 앱을 상상해보십시오 . 각 사용자 프로필 페이지에서 무한 스크롤과 함께 일부 사용자 정보와 마지막 게시물을 표시하려고합니다. 한 사용자 프로필에서 다른 사용자 프로필로 이동할 수 있습니다. …

132 javascript  facebook  architecture  reactjs  reactjs-flux 

React로 웹 애플리케이션을 개발할 때 기본값이 된 react-router-dom이라는 마지막 버전의 react-router 모듈을 사용하고 있습니다. POST 요청 후 리디렉션하는 방법을 알고 싶습니다. 이 코드를 만들고 있지만 요청 후 아무 일도 일어나지 않습니다. 나는 웹에서 검토하지만 모든 데이터는 반응 라우터의 이전 버전에 관한 것이며 마지막 업데이트에는 없습니다. 암호: import React, { PropTypes …

132 javascript  reactjs  react-router 

구성 요소 상태의 배열에서 요소를 제거하는 가장 좋은 방법을 찾으려고합니다. this.state변수를 직접 수정해서는 안되므로 배열에서 요소를 제거하는 더 나은 방법 (더 간결한 방법)이 있습니까? onRemovePerson: function(index) { this.setState(prevState => { // pass callback in setState to avoid race condition let newData = prevState.data.slice() //copy array from prevState newData.splice(index, 1) // …

131 javascript  reactjs 

드롭 다운의 높이와 화면의 입력 위치에 따라 드롭 다운을 입력의 위 또는 아래로 이동시키는 스크립트를 작성 중입니다. 또한 방향에 따라 수정자를 드롭 다운하도록 설정하고 싶습니다. 그러나 setState내부를 사용 componentDidUpdate하면 무한 루프 가 생성됩니다 (명백합니다) getDOMNode클래스 이름을 사용 하고 드롭 다운으로 직접 설정 하는 솔루션을 찾았 지만 React 도구를 사용하는 더 …

131 javascript  reactjs  ecmascript-6 

ReactJS와 React-Router를 처음 사용합니다. prop -router<Link/> 로부터 객체 를 props 통해받는 구성 요소가 있습니다. 사용자 가이 구성 요소 내에서 '다음'버튼을 클릭 할 때마다 객체를 수동으로 호출하려고합니다 .<Link/> 지금은 Refs 를 사용하여 백업 인스턴스 에 액세스하고 <Link/>생성 되는 'a'태그를 수동으로 클릭합니다 . 질문 : 링크를 수동으로 호출하는 방법이 this.props.next.go있습니까 (예 :) …

131 javascript  reactjs  react-router 

프로젝트에 React 맵 구성 요소를 추가하려고하는데 오류가 발생합니다. Fullstack React의 블로그 게시물 을 참조로 사용하고 있습니다. google_map.js 라인 83에서 오류가 발생하는 위치를 추적했습니다. function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } 지금까지 내지도 구성 요소는 다음과 같습니다. 마지막 …

130 javascript  google-maps  reactjs  ecmascript-6  react-router 

React 이벤트의 올바른 유형은 무엇입니까? 처음에는 any단순함을 위해 사용 했습니다. 이제 나는 물건을 정리하고 any완전히 사용하지 않으려 고 노력하고 있습니다 . 따라서 다음과 같은 간단한 형태로 : export interface LoginProps { login: { [k: string]: string | Function uname: string passw: string logIn: Function } } @inject('login') @observer export class …

130 javascript  reactjs  typescript 

이야기는 밥, 샐리, 잭을 상자에 넣을 수 있어야한다는 것입니다. 상자에서 둘 중 하나를 제거 할 수도 있습니다. 제거하면 슬롯이 남지 않습니다. people = ["Bob", "Sally", "Jack"] 이제 "밥"이라고 말하고 제거해야합니다. 새 배열은 다음과 같습니다. ["Sally", "Jack"] 내 반응 구성 요소는 다음과 같습니다. ... getInitialState: function() { return{ people: [], } …

130 javascript  arrays  reactjs 

API 서버에서 토큰을 가져 오는 react / redux 애플리케이션이 있습니다. 사용자가 인증 한 후 모든 axios 요청이 작업의 모든 요청에 ​​수동으로 첨부 할 필요없이 해당 토큰을 Authorization 헤더로 갖도록 만들고 싶습니다. 나는 반응 / redux를 처음 접했으며 최선의 접근 방식을 확신하지 못하며 Google에서 품질 히트를 찾지 못했습니다. 내 redux 설정은 …

130 reactjs  redux  axios 

저는 Angular 개발자이며 React를 처음 사용합니다. 이것은 간단한 반응 구성 요소이지만 작동하지 않습니다. import react , { Component} from 'react'; import { render } from 'react-dom'; class TechView extends Component { constructor(props){ super(props); this.state = { name:'Gopinath' } } render(){ return( <span>hello Tech View</span> ); } } export default TechView; …

129 reactjs