반응형

react-router 21

Reducx-redex-reduced v4/v5 푸시슈트가 thunk 동작 내부에서 작동하지 않음

Reducx-redex-reduced v4/v5 푸시슈트가 thunk 동작 내부에서 작동하지 않음 인index.js직접 푸시 또는 디스패치가 효과적임: ... import { push } from 'react-router-redux' const browserHistory = createBrowserHistory() export const store = createStore( rootReducer, applyMiddleware(thunkMiddleware, routerMiddleware(browserHistory)) ) // in v5 this line is deprecated export const history = syncHistoryWithStore(browserHistory, store) histo..

IT이야기 2022.03.19

react-router 렌더 함수의 URL 매개 변수에 액세스

react-router 렌더 함수의 URL 매개 변수에 액세스 이것은 빠른 질문이지만 나는 지금까지 해결책을 찾지 못했다. 렌더링 방법을 사용하여 react-router v4로 URL 매개 변수에 액세스하고 싶다.지금까지 찾아낸 것은 모두 이렇게 구성 요소를 지나칠 뿐이었다. 그러나 다음과 같은 렌더링 방법을 사용하고 싶다. ( )} /> 하지만, 그match에 액세스하려고 할 때 소포가 정의되지 않음id에 대한 매개 변수.props.match.params.id나의Child구성 요소 렌더 함수를 사용하고도 url 매개 변수에 액세스할 수 있는 방법이 있는지 알아보시겠습니까?의 소품들을 물려주어야 한다.Route로Child: ( )} /> 또는 : ( )} /> 사용할 수 있다location.searchU..

IT이야기 2022.03.19

테스트하는 동안 MemoryRouter를 사용하여 경로로 이동할 수 없음

테스트하는 동안 MemoryRouter를 사용하여 경로로 이동할 수 없음 나는 그 예들을 면밀히 따랐지만, MemoryRouter가 농담과 효소를 이용한 테스트로 작업하도록 할 수는 없다. 경로 중 하나로 이동하여 스냅샷에 반영하고 싶다.하므로, 는 MemoryRouterh"를 "/A"로 .A import React from 'react'; import Enzyme, {mount} from 'enzyme'; import Adapter from 'enzyme-adapter-react-16'; import {BrowserRouter as Router, MemoryRouter, Route, Switch} from 'react-router-dom'; Enzyme.configure({adapter: new Ada..

IT이야기 2022.03.19

URLSearchParams가 빈 객체를 반환함

URLSearchParams가 빈 객체를 반환함 검색을 받고 싶다.params덧붙이다paramsURL로 이동하지만 매번 빈 배열을 가져오는 경우. 예제 URL -http://localhost:3000/buildings?search_query=test&page=2 constructor(props) { super(props); const params: URLSearchParams = new URLSearchParams(this.props.location.search); console.log(params); //Getting empty object {} } 해보다 console.log(params.get("page")); '2'를 반환해야 한다.URLSearchParams는 콘솔에서 빈 객체로 표시되며 모든 ..

IT이야기 2022.03.18

대응 라우터를 사용하여 사이드바 유지

대응 라우터를 사용하여 사이드바 유지 바꾸고 싶다Detail그리고Blog하지만 여전히 간직하고 있다Sidebar나는 아래 코드와 같이 사용하지만 작동하지 않는다.수정하는 것 좀 도와줄래?정말 감사합니다. const routes = ( ) } /> ) } /> ); class App extends React.Component { render () { const {feature, main, sidebar, mainbottom } = this.props; return ( {feature} {main} {sidebar} {mainbottom} ) } } ReactDOM.render( (routes), document.getElementById('app') ); 여러 경로에서 동일한 사이드바를 유지하려면 사이드바..

IT이야기 2022.03.17

reactj가 있는 링크에 프록시를 사용하는 방법

reactj가 있는 링크에 프록시를 사용하는 방법 나는 프런트엔드에 리액션과 타이프스크립트를 사용하는 웹사이트에서 일하고 있고 백엔드는 자바에 있어.개발 중에 프런트엔드는 포트 3000, 백엔드는 포트 8080을 사용한다.나는 패키지에 프록시 속성을 설정했다.json "proxy": "http://localhost:8080" 그래서 나는 대리인이 완벽하게 작동하기 때문에 백엔드에 요청을 하는 동안 아무런 문제가 없어. 이제 보고서를 다운로드하기 위한 링크를 만들어야 하니까 동적으로 링크를 생성하는 중이고 포트 3000이 아닌 포트 8080을 가리키도록 해야 해. 나는 다음과 같이 URL을 전달하고 있다. Download Report 여기서, this.state.properties.user는 /snf/sn..

IT이야기 2022.03.15

라우터 변경 url 응답은 하지만 보기 없음

라우터 변경 url 응답은 하지만 보기 없음 나는 라우팅에 반응하여 보기를 변경하는 데 어려움을 겪고 있다.사용자 목록만 표시하려고 하며 각 사용자를 클릭하면 세부 정보 페이지로 이동하십시오.라우터는 다음과 같다. import React from "react"; import ReactDOM from "react-dom"; import { BrowserRouter } from 'react-router-dom'; import Users from "./components/Users"; import { Router, Route } from "react-router"; import Details from "./components/Details"; ReactDOM.render(( ), document.getElem..

IT이야기 2022.03.14

반응 - 무거운 하위 구성 요소 렌더링 지연

반응 - 무거운 하위 구성 요소 렌더링 지연 라우터 반응 및 반응 라우터를 사용하고 있으며 일부 페이지에는 페이지의 큰 목록(하위 구성요소)이 렌더링되어 있다.페이지를 변경하기 위해 링크를 클릭하면 모든 하위 구성요소가 렌더링될 때까지 기다리며, 이는 클릭과 시각적 피드백 사이의 지연을 의미한다.일부 하위 구성요소가 렌더링되기를 기다리지 않는 간단한 방법이 있는가? 최선의 방법을 찾고 있지만 부울과 부울로setTimeout()유일한 방법이야고마워구성 요소의 목록이 크면 모든 구성 요소를 동시에 볼 수 없는 경우가 많다.가상화된 대응 기능을 사용하여 실제로 가시적인 구성 요소만 렌더링할 수 있다.아래 코드를 확인하십시오. const LightComponent = () => LightComponent con..

IT이야기 2022.03.13

여러 경로를 반응 라우터 v4와 일치

여러 경로를 반응 라우터 v4와 일치 동일한 구성 요소를 렌더링하는 경로가 2개인 경우 다음과 같이 경로 구성을 반복하지 않으려면 어떻게 해야 하는가? 지금까지 찾은 최고의 해결책(그러나 좀 이상한 것 같다): 좋은 대답이야.이는 다음과 같은 시나리오에서도 도움이 된다. 없는(path2|path3)두 가지 구성 요소MyComp그리고MyAnotherComp경로가 다음과 같을 경우 장착됨/path/path2. PS. 코멘트로 추가되었을 수 있지만 자격이 없는 :) https://reactrouter.com/web/api/Route 이상 버전 5의 경우다중 일치(다른 매개 변수)를 허용해야 하지만 매개 변수가 없는 경우(예: 일치 URL): /message /migrate/migration /1987/그것이 ..

IT이야기 2022.03.13

컨텍스트가 Redex connect()를 통해 전달되지 않음

컨텍스트가 Redex connect()를 통해 전달되지 않음 편집: 설정의 Redex 문제 해결 제안으로 컨텍스트 변경 시 연결된 Child 업데이트를 할 수 있었다.{ pure: false }그러나 나는 이것을 내가 업데이트하고 싶은 Child의 부모인 연결된 모든 구성요소에 추가해야 했다.많은 구성 요소에 이렇게 해야 한다는 것이 이상하고 비효율적으로 보인다. 우선 내가 원하는 최종 결과가 무엇인지를 설명한 후에 내가 생각하는 문제점에 대해 생각해 볼 것이다. 나는 나의 Route 구성요소의 손주 구성요소 내에서 반응 라우터의 매개 변수에 액세스하고 싶다.「기록·지속·재생·시간여행 이용」을 사용하고 있지 않으면, 현재 루트를 스토어와 동기화할 필요가 없다는 참조가 여러 개 있어, 지금까지 피했다.Da..

IT이야기 2022.03.12
반응형