반응형

react-router 36

React 앱에서 무한 루프/충돌을 일으키는 이유는?

React 앱에서 무한 루프/충돌을 일으키는 이유는? 현재 React+Redex 프런트 엔드 앱을 개발 중인데, 내게는 설명할 수 없을 것 같은 문제에 부딪히고 있다.컴포넌트를 사용할 때는 홈페이지(/경로)를 제외한 다른 페이지에서도 올바르게 작동한다.홈페이지에서 클릭하면 앱/브라우저가 다운된다. 나는 리액터-루터-리액션-리펙스를 태그에 포함시켰다. 왜냐하면 나는 리액터-리액션-리플렉스를 사용하기 때문이다. 그들이 실제로 문제의 원인에 어떤 기여를 했는지 모르겠다. 다음과 같은 설정이 있다. src/index.js ... render( , document.getElementById('mount') ); ... src/footer.js ... Privacy Another Link Disclaimer Coo..

Programing 2022.03.24

페이지의 전체 내용을 변경하는 방법

페이지의 전체 내용을 변경하는 방법 최근에 나는 페이지를 작성하고 있는데 한가지 간단한 문제가 생겼다.사용자가 클릭하는 내용에 따라 페이지의 전체(내비바 제외) 내용을 변경하고 싶다.하지만 어떻게 해야 할지 모르겠다 :( div "HalfDivided"의 전체 내용을 다음에 대해 변경하고 싶다. 홈 or 정보 dependend on which link has been clicked plz 도와줘 얘들아 :> render() { return ( Your Tokens Your Colors ); } } function YourTokens() { return ( Home ); } function YourColors() { return ( About ); } 코멘트에서 논의한 내용 중에서 다음 사항을 살펴보십시오..

Programing 2022.03.24

환원기(저감-라우터)의 현재 위치에 액세스하는 방법?

환원기(저감-라우터)의 현재 위치에 액세스하는 방법? 환원기에 환원기를 넣은 상태에서 현재 위치의 현재 경로 및 쿼리를 얻는 방법은?mapStateToProps로 구성 요소 내에서 경로 이름을 쉽게 얻을 수 있지만, 현재 경로에 대한 Reducer에 액세스하고 싶다.Reducx-router 1.0.0-beta7 react-router 1.0.3을 사용하고 있다.1.way - rendix-thunk 및 getState()를 통해 특정 동작이 포함된 패스 경로 이름 const someAction = data =>(dispatch,getState)=>{ dispatch({ type:'SOME_ACTION', pathname:getState().router.pathname }) } 2.way - 모든 동작으로 ..

Programing 2022.03.23

다음.js 다른 페이지로 리디렉션

다음.js 다른 페이지로 리디렉션 나는 Next.js에 새로 들어왔고, 예를 들어 시작 페이지( / )에서 hello-nextjs로 어떻게 리디렉션할지 궁금하다.사용자가 페이지를 로드한 후 경로 === /hello-nextjs로 리디렉션되는지 확인 리액터-루터(react-router)에서 우리는 다음과 같은 일을 한다. // or } /> 12★★이름: Next.js >= 12 이제 미들웨어를 사용하여 리디렉션하고_middleware.js페이지 폴더 내 파일(또는 페이지 내 하위 폴더) import { NextResponse, NextRequest } from 'next/server' export async function middleware(req, ev) { const { pathname } = re..

Programing 2022.03.22

사용내역 react-router-dom 잘못된 후크 호출

사용내역 react-router-dom 잘못된 후크 호출 나는 실행하려고 한다.useHistory에서 낚아채다.react-router-dom효과가 없는 것 같아잘못된 후크 호출 발생 앱.js import React, { Component } from 'react'; import { Signup } from './Signup.js'; import { Login } from './Login.js'; import { Account } from './Account.js'; import { AuthProvider } from './contexts/AuthContext.js'; import { BrowserRouter as Router, Switch, Route } from 'react-router-dom'; cl..

Programing 2022.03.21

형식 설명으로 대응: 속성 'push'가 유형 'History'에 없음

형식 설명으로 대응: 속성 'push'가 유형 'History'에 없음 역사 오브젝트 안으로 밀어넣어 시야에서 벗어나려고 한다.그러나 경로를 입력하려고 하면 다음과 같은 오류 메시지가 표시된다. 속성 'push'는 유형 'History'에 존재하지 않는다. render(){ return ( withRouter(({history}) => ({history.push('/home')}} className="btn btn-primary">Pieteikties)) ) } 이 문제를 해결하려면 어떻게 해야 할까? 편집: 나는 또한 이것을 시도했다: logIn(){ this.props.history.push('/new-location') } 다음과 같은 구성 요소로: render(){ return ( Pieteikt..

Programing 2022.03.19

쓸모없는 반복 경로를 바꾸는 방법

쓸모없는 반복 경로를 바꾸는 방법 나는 처음으로 리액터러터와 함께 일한다. 여기 내 코드 조각이 있다. 이 부분은.코드는 항상 반복된다.이 반응 라우터를 줄일 방법이 없으십니까?만약 당신이 네개의 특정 루트를 다룰 필요가 있다면 (A | B | C | D); 그래도 파라미터를 가로채야 하지만 값이 A | B | C | D |만 될 수 있다면 다음과 같이 쓸 수 있다. 다음 두 가지 매개 변수를 사용하십시오. const { letter, feeros } = match.params; 글자만: "A", "B", "C" 또는 "D" 다른 정규식을 사용할 수 있다. 예를 들면 다음과 같다. 이 경로는 다음과 같은 라틴어 한 글자에 대해 작동된다. '/A/xx/xxx/value' '/s/xx/xxx/value' '..

Programing 2022.03.19

반응 라우터 - onEnter에서 경로 매개 변수를 사용하는 방법

반응 라우터 - onEnter에서 경로 매개 변수를 사용하는 방법 OnEnter 콜백을 사용하여 가져오기를 수행하려고 하는데, 라우트 구성 요소에서 URL 파라미터를 읽는 방법을 모르겠어.나는 이 루트를 가지고 있다. I want to use the.bookIdfunction parameter로서 경로로부터.onBookLoad(). 가능한가?신경 쓰지 마, 사소한 일이었어. export function onBookLoad(nextState) { console.log(nextState.params.bookId); //do stuff with the param } 참조URL: https://stackoverflow.com/questions/37212328/react-router-how-to-use-route..

Programing 2022.03.17

리액션 + 라우팅 + 보안

리액션 + 라우팅 + 보안 React and react-router로 웹 애플리케이션을 만들고 있으며 기존 외부 액세스 관리 인프라(OpenAM)로 React 애플리케이션의 일부 경로를 보호하고 싶다. 나는 http://web.example.com:8080/myapp/#/user-profile url을 보호하고 싶다. 이는 로그인한 사용자만이 이 경로에 액세스할 수 있다는 것을 의미한다. 나는 공공 루트가 있고 어떤 사용자라도 http://web.example.com:8080/myapp/#/welcome과 같은 루트를 열 수 있다. 액세스 관리는 URL을 보호하며, 사용자가 보호된 URL을 열고자 할 경우 액세스 관리자에 의해 로그인 양식이 표시되고 로그인이 성공하면 원래 요청된 URL이 표시된다. 여기..

Programing 2022.03.15

로그인 및 등록 페이지의 탐색 표시줄을 숨기는 방법

로그인 및 등록 페이지의 탐색 표시줄을 숨기는 방법 난 내 길을 이렇게 알고 있어: 내 AppContainer: var AppContainer = React.createClass({ render: function () { return ( ); } }); 여기서 헤더 구성요소는 모든 페이지에서 렌더링된다.로그인 및 등록 페이지에서 헤더를 피할 수 있는 방법이 있는가?즉, 구성 요소(AppContainer)의 상태가 유지됨을 의미한다.따라서 다음과 같은 것을 가져야 한다. var AppContainer = React.createClass({ // state management in here render: function () { let navHeader = this.state.isAuth ? : ''; re..

Programing 2022.03.14
반응형