«reactjs» 태그된 질문

크롬 확장 프로그램이 'manifest.json'을 사용한다는 것을 알고 있지만 여기서는 다른 것으로도 사용됩니다. 내용- { "short_name": "React App", "name": "Create React App Sample", "icons": [ { "src": "favicon.ico", "sizes": "192x192", "type": "image/png" } ], "start_url": "./index.html", "display": "standalone", "theme_color": "#000000", "background_color": "#ffffff" } 일부 값을 변경하면 페이지가 업데이트되지만 아무것도 변경되지 않습니다.

91 reactjs  manifest  create-react-app 

JSX에 공백을 추가하는 방법 (및 이유 )을 이해 하지만 모범 사례가 무엇인지 또는 실제 차이가 있는지 궁금합니다. 두 요소를 범위로 래핑 <div className="top-element-formatting"> <span>Hello </span> <span className="second-word-formatting">World!</span> </div> 한 줄에 추가 <div className="top-element-formatting"> Hello <span className="second-word-formatting">World!</span> </div> JS로 공간 추가 <div className="top-element-formatting"> Hello {" "} <span className="second-word-formatting">World!</span> </div>

91 javascript  reactjs  react-jsx 

내가 얻고 index.js빌드 하려는 회전 목마 파일이 block.build.js있으므로 다음 과 webpack.config.js같습니다. var config = { entry: './index.js', output: { path: __dirname, filename: 'block.build.js', }, devServer: { contentBase: './Carousel' }, module : { rules : [ { test: /.js$/, loader: 'babel-loader', exclude: /node_modules/, query: { presets: ['react', 'es2015'], plugins: ['transform-class-properties'] } …

91 reactjs  webpack  babeljs 

검색 기록에 따라 비즈니스 로직을 구현해야합니다. 내가 원하는 것은 다음과 같습니다. reactRouter.onUrlChange(url => { this.history.push(url); }); URL이 업데이트 될 때 react-router에서 콜백을받는 방법이 있습니까?

91 reactjs  react-router  react-router-v4  react-router-redux  react-router-dom 

React-Router (v4)를 시도 중이며 Nav를 시작하여 Link's 중 하나를 사용하는 데 문제가 있습니다 active. Link태그 중 하나를 클릭 하면 활성 항목이 작동하기 시작합니다. 그러나 홈 Link이 /경로 에서로드되는 구성 요소이기 때문에 앱이 시작되는 즉시 활성화 되기를 원합니다 . 이것을 할 방법이 있습니까? 내 현재 코드는 다음과 같습니다. const Router = …

91 javascript  reactjs  ecmascript-6  react-router 

나는 eslint& eslint-plugin-react. ESLint를 실행할 때 linter는 no-unused-vars각 React 구성 요소에 대해 오류를 반환 합니다. JSX 또는 React 구문을 사용하고 있음을 인식하지 못한다고 가정하고 있습니다. 어떤 아이디어? 예: app.js import React, { Component } from 'react'; import Header from './header.js'; export default class App extends Component { render() { return …

91 javascript  reactjs  jsx  eslint 

react-select를 사용하는 데 문제가 있습니다. 나는 redux 양식을 사용하고 내 react-select 구성 요소를 redux 양식과 호환되도록 만들었습니다. 다음은 코드입니다. const MySelect = props => ( <Select {...props} value={props.input.value} onChange={value => props.input.onChange(value)} onBlur={() => props.input.onBlur(props.input.value)} options={props.options} placeholder={props.placeholder} selectedValue={props.selectedValue} /> ); 그리고 여기 렌더링 방법 : <div className="select-box__container"> <Field id="side" name="side" component={SelectInput} …

91 reactjs  default-value  react-select 

나는 일반적으로 스택에 코드 관련 내용을 게시하지만 이것은 커뮤니티의 일반적인 생각이 무엇인지에 대한 질문에 더 가깝습니다. 데이터 / 상태를 관리하기 위해 React와 함께 Redux를 사용하는 것을 옹호하는 많은 사람들이있는 것 같지만, 둘 다 읽고 배우는 동안 옳지 않은 것을 발견했습니다. Redux 이 페이지 하단 : http://redux.js.org/docs/basics/UsageWithReact.html (스토어 통과) React 'Context'의 …

90 javascript  reactjs  redux 

나는 본질적으로 반응하는 탭을 만들려고 노력하고 있지만 몇 가지 문제가 있습니다. 여기에 파일이 있습니다 page.jsx <RadioGroup> <Button title="A" /> <Button title="B" /> </RadioGroup> 버튼 A를 클릭하면 RadioGroup 구성 요소가 버튼 B의 선택을 취소해야합니다 . "선택됨"은 상태 또는 속성의 className을 의미합니다. 여기 있습니다 RadioGroup.jsx: module.exports = React.createClass({ onChange: function( e ) …

90 reactjs 

컨테이너 구성 요소에서 프레젠테이션 구성 요소를 분리하려고합니다. 나는 SitesTable및 SitesTableContainer. 컨테이너는 현재 사용자를 기반으로 적절한 사이트를 가져 오기 위해 redux 작업을 트리거하는 역할을합니다. 문제는 컨테이너 구성 요소가 처음에 렌더링 된 후 현재 사용자를 비동기 적으로 가져 오는 것입니다. 이 수단은 컨테이너 구성 요소는 자신의 코드를 다시 실행해야 함을 알고하지 않는 …

90 reactjs  redux  react-redux 

여기서<canvas> 찾은 이 멋진 애니메이션을 React 재사용 가능한 구성 요소로 변환하려고합니다 . 이 구성 요소에는 캔버스에 대해 하나의 상위 구성 요소가 필요하고 .function Ball() 성능상의 이유로 Balls상태 비 저장 구성 요소로 만드는 것이 더 좋을 것입니다. 상태 비 저장 구성 요소를 만드는 데 익숙하지 않으며 .NET에서 정의 된 this.update()및 this.draw함수를 …

90 reactjs 

제목이 다 나와 있다고 생각합니다. 여전히 페치중인 구성 요소를 마운트 해제 할 때마다 노란색 경고가 표시됩니다. 콘솔 경고 : 마운트 해제 된 구성 요소 에서는 호출 setState(또는 forceUpdate) 할 수 없습니다 . 이것은 작동하지 않지만 ... 수정하려면 componentWillUnmount메서드의 모든 구독 및 비동기 작업을 취소하십시오 . constructor(props){ super(props); this.state = { …

90 reactjs 

을 사용할 <input>때 값 에 액세스하는 방법에 대해 혼란 스럽습니다 mount. 내 테스트로 얻은 것은 다음과 같습니다. it('cancels changes when user presses esc', done => { const wrapper = mount(<EditableText defaultValue="Hello" />); const input = wrapper.find('input'); console.log(input.render().attr('value')); input.simulate('focus'); done(); }); 콘솔이 출력합니다 undefined. 그러나 코드를 약간 수정하면 작동합니다. it('cancels changes …

90 unit-testing  reactjs  enzyme 

저는 React를 처음 사용 DATA하고 외부 파일에서 JSON 변수 를 가져 오려고 합니다. 다음과 같은 오류가 발생합니다. "./customData.json"모듈을 찾을 수 없습니다. 누군가 나를 도울 수 있습니까? 내 DATA변수 가 있으면 작동 index.js하지만 외부 JSON 파일에 있으면 작동 하지 않습니다. index.js import React, {Component} from 'react'; import ReactDOM from 'react-dom'; import …

90 javascript  json  reactjs 

React로 무한 스크롤을 구현하는 방법을 찾고 있습니다. 나는이 건너 반응 - 무한 스크롤을 하고 비효율적이 바로 DOM에 노드를 추가하고 제거하지 않는 한 발견했다. DOM에서 일정한 수의 노드를 추가, 제거 및 유지하는 React로 입증 된 솔루션이 있습니까? 다음은 jsfiddle 문제입니다. 이 문제에서는 한 번에 DOM에 50 개의 요소 만 갖고 싶습니다. …

90 javascript  html  infinite-scroll  reactjs