«reactjs» 태그된 질문

입력을 변경해서는 안되며 개체를 복제하여 변경해야한다는 것을 알고 있습니다. 나는 redux 스타터 프로젝트에서 사용되는 규칙을 따르고 있었다. ADD_ITEM: (state, action) => ({ ...state, items: [...state.items, action.payload.value], lastUpdated: action.payload.date }) 항목을 추가하기 위해-스프레드를 사용하여 배열에 항목을 추가합니다. 내가 사용한 삭제 : DELETE_ITEM: (state, action) => ({ ...state, items: [...state.items.splice(0, action.payload), ...state.items.splice(1)], …

116 javascript  reactjs  redux 

React.js로 시작하고 간단한 양식을 작성하고 싶지만 문서에서 두 가지 방법을 찾았습니다. 첫 번째 는 Refs를 사용하는 것 입니다 . var CommentForm = React.createClass({ handleSubmit: function(e) { e.preventDefault(); var author = React.findDOMNode(this.refs.author).value.trim(); var text = React.findDOMNode(this.refs.text).value.trim(); if (!text || !author) { return; } // TODO: send request to the server React.findDOMNode(this.refs.author).value …

116 reactjs 

나는 vanilla js에서 알아, 우리는 할 수있다 onclick="f1();f2()" ReactJS에서 두 개의 함수 호출 onClick을 만드는 것과 동등한 것은 무엇입니까? 하나의 함수를 호출하는 것은 다음과 같습니다. onClick={f1}

116 javascript  reactjs 

특정 페이지에서 이동할 때 ReactJS 앱이 사용자에게 알리기를 원합니다. 특히 조치를 취하도록 상기시키는 팝업 메시지 : "변경 사항이 저장되었지만 아직 게시되지 않았습니다. 지금 수행 하시겠습니까?" 이를 react-router전역 적으로 트리거해야합니까 , 아니면 반응 페이지 / 구성 요소 내에서 수행 할 수 있습니까? 나는 후자에서 아무것도 찾지 못했고 차라리 첫 번째를 피하고 …

116 reactjs  react-router 

아래 후크 예제 고려 import { useState } from 'react'; function Example() { const [count, setCount] = useState(0); return ( <div> <p>You clicked {count} times</p> <button onClick={() => setCount(count + 1)}> Click me </button> </div> ); } 기본적으로 this.forceUpdate () 메서드를 사용하여 아래 예제와 같이 React 클래스 구성 요소에서 구성 …

116 javascript  reactjs  react-native  react-hooks 

React with Hooks에서 상태를 업데이트하는 올바른 방법은 무엇입니까? export Example = () => { const [exampleState, setExampleState] = useState( {masterField: { fieldOne: "a", fieldTwo: { fieldTwoOne: "b" fieldTwoTwo: "c" } } }) 한 사람이 어떻게 사용하는 것이 setExampleState업데이 트에 exampleState에 a(AN 필드를 추가)? const a = { masterField: { fieldOne: …

116 javascript  reactjs  react-hooks 

다음 구성 요소 ( radioOther.jsx)가 있습니다. 'use strict'; //module.exports = <-- omitted in update class RadioOther extends React.Component { // omitted in update // getInitialState() { // propTypes: { // name: React.PropTypes.string.isRequired // } // return { // otherChecked: false // } // } componentDidUpdate(prevProps, prevState) { var otherRadBtn = …

115 reactjs  ecmascript-6 

xcode에서 반응 네이티브 iOS 앱을 빌드하는 동안이 오류가 발생합니다. npm 설치 및 react-native-fs 라이브러리를 연결하는 rpm 후이 오류가 발생하기 시작했습니다 . 그러나 온라인에서 솔루션을 검색 한 후 많은 사람들이 다른 반응 네이티브 라이브러리를 설치하는 동안 동일한 오류가 발생하는 것을 발견했습니다. 가능한 솔루션 "빌드 설정"에서 다음과 같은 추가 많은 IS에 의해 …

115 ios  xcode  reactjs  native  react-native-ios 

<ScrollView>React Native에서 현재 스크롤 위치 또는 구성 요소 의 현재 페이지를 가져올 수 있습니까? 그래서 다음과 같습니다. <ScrollView horizontal={true} pagingEnabled={true} onScrollAnimationEnd={() => { // get this scrollview's current page or x/y scroll position }}> this.state.data.map(function(e, i) { <ImageCt key={i}></ImageCt> }) </ScrollView>

115 ios  reactjs  react-native 

React 16.7-alpha에서 새로운 후크 시스템을 가지고 놀았고 내가 처리중인 상태가 객체 또는 배열 일 때 useEffect에서 무한 루프에 갇혀 있습니다. 먼저 useState를 사용하고 다음과 같은 빈 개체로 시작합니다. const [obj, setObj] = useState({}); 그런 다음 useEffect에서 setObj를 사용하여 다시 빈 개체로 설정합니다. 두 번째 인수로 객체 의 내용 이 변경되지 …

115 reactjs  react-hooks 

따라서 일반적으로 간단한 스타일링이 필요한 대부분의 SVG 아이콘을 포함하려면 다음을 수행합니다. <svg> <use xlink:href="/svg/svg-sprite#my-icon" /> </svg> 이제 새로운 프런트 엔드 개발 스택의 가능한 구성 요소로 나중에 ReactJS를 평가하고 있지만 지원되는 태그 / 속성 목록에서 둘 다 지원 되지 use않거나 xlink:href지원 되지 않는다는 것을 알았습니다 . svg 스프라이트를 사용하고 ReactJS에서 이런 …

114 svg  sprite  reactjs 

우리의 응용 프로그램은 무한 스크롤을 사용하여 이기종 항목의 큰 목록을 탐색합니다. 몇 가지 주름이 있습니다. 일반적으로 사용자는 10,000 개의 항목 목록을 가지고 있고 3k 이상을 스크롤해야합니다. 이들은 풍부한 항목이므로 브라우저 성능이 허용되지 않을 때까지 DOM에 수백 개만있을 수 있습니다. 항목의 높이는 다양합니다. 항목에는 이미지가 포함될 수 있으며 사용자가 특정 날짜로 …

114 javascript  html  infinite-scroll  reactjs 

의 가장 큰 장점 중 하나 React.js이 있어야하는데 서버 측 렌더링 . 문제는 키 기능 React.renderComponentToString()이 동기식이므로 구성 요소 계층이 서버에서 렌더링 될 때 비동기 데이터를로드 할 수 없다는 것입니다. 페이지의 어느 곳에 나 놓을 수있는 주석 작성을위한 범용 구성 요소가 있다고 가정 해 보겠습니다. 여기에는 하나의 속성, 일종의 식별자 …

114 node.js  reactjs  flux  reactjs-flux 

나는 React를 가지고 놀았고 Date.now()화면에 렌더링되는 다음과 같은 시간 구성 요소를 가지고 있습니다. import React, { Component } from 'react'; class TimeComponent extends Component { constructor(props){ super(props); this.state = { time: Date.now() }; } render(){ return( <div> { this.state.time } </div> ); } componentDidMount() { console.log("TimeComponent Mounted...") } } export …

114 javascript  reactjs 

이 질문은 이미 몇 번 요청되었지만 대부분의 경우 해결책은 책임의 흐름이 하강하기 때문에 부모에서 이것을 처리하는 것입니다. 그러나 때로는 메서드 중 하나에서 구성 요소를 종료해야합니다. props를 수정할 수 없다는 것을 알고 있으며, 상태로 부울을 추가하기 시작하면 간단한 구성 요소에 대해 정말 지저분해질 것입니다. 내가 달성하려는 것은 다음과 같습니다. "x"가있는 작은 …

114 reactjs  unmount