reactjs 16

React JS: 양방향 무한 스크롤 모델링

React JS: 양방향 무한 스크롤 모델링 이 어플리케이션에서는 무한 스크롤을 사용하여 이종 아이템의 방대한 목록을 탐색합니다.몇 가지 주름이 있습니다. 사용자에게는 10,000개의 아이템 리스트가 있어 3k+를 스크롤해야 하는 것이 일반적입니다. 이것들은 풍부한 아이템이기 때문에 브라우저의 퍼포먼스가 받아들여지지 않게 되기 전에 DOM에는 몇 백 개밖에 없습니다. 물건의 높이가 다르다. 아이템에는 이미지가 포함되어 있을 수 있으며 사용자가 특정 날짜로 이동할 수 있습니다.사용자가 리스트에서 뷰포트 위에 이미지를 로드해야 하는 지점으로 점프할 수 있기 때문에 콘텐츠를 로드할 때 아래로 밀릴 수 있습니다.이를 처리하지 못하면 사용자가 날짜로 점프했다가 이전 날짜로 이동할 수 있습니다. 알려진 불완전한 솔..

programing 2023.03.05

"Warning: useLayoutEffect does nothing on server?"를 수정하는 방법

"Warning: useLayoutEffect does nothing on server?"를 수정하는 방법 다음은 완전한 오류입니다. 경고: useLayoutEffect는 서버 렌더러의 출력 형식으로 인코딩할 수 없으므로 서버에서 아무 작업도 수행하지 않습니다.이로 인해 초기 유압식 UI와 의도된 UI가 일치하지 않게 됩니다.이를 방지하려면 useLayoutEffect를 클라이언트 전용으로 렌더링하는 컴포넌트에서만 사용해야 합니다. in ForwardRef(ButtonBase) in WithStyles(ForwardRef(ButtonBase)) in ForwardRef(Button) in WithStyles(ForwardRef(Button)) in form in div 검사를 할 때마다 나와요.내 시험이..

programing 2023.02.23

redux-thunk와 redux-promise의 차이점은 무엇입니까?

redux-thunk와 redux-promise의 차이점은 무엇입니까? 제가 알고 있는 바로는 redux-thunk는 액션 자체에서 비동기 함수와 디버깅 값을 디스패치하는 데 도움이 되는 미들웨어입니다.단, redux-promise를 사용하면 비동기 함수를 만들 수 있는 것은 액션 자체 메커니즘을 구현하지 않으면 액션에서 플레인 오브젝트만 디스패치하는 예외입니다. 이 두 패키지의 주요 차이점은 무엇입니까?두 패키지를 모두 한 페이지 리액트 앱으로 사용하거나 redux-thunk를 고수하면 충분한 장점이 있습니까? redux-thunk하면 액션 할 수 . function myAction(payload){ return function(dispatch){ // use dispatch as you please ..

programing 2023.02.23

Visual Studio 코드 포맷 변경(React-JSX)

Visual Studio 코드 포맷 변경(React-JSX) 인덱스에는 다음과 같은 스니펫이 있습니다.js class App extends Component { render() { return ( Welcome to React! ) } } 코드는 동작하지만 비주얼 스튜디오 포맷을 저장할 때마다(ctrl+s) jsx는 다음과 같습니다. class App extends Component { render() { return ( Welcome to React! ) } } 어떻게 하면 해결할 수 있을까요?감사해요.결국 이 트릭은 아래쪽 툴바의 파일 형식을 JavaScript에서 JavaScript React로 변경하는 것이었습니다.이 주제에 대..

programing 2023.02.23

Visual Studio 코드의 JSX 또는 HTML 자동 완성

Visual Studio 코드의 JSX 또는 HTML 자동 완성 Visual Studio Code visual visualHTML?왜냐하면 Bootstrap 등의 수업이 있을 때는 각 문자를 수동으로 입력하는 것은 좋지 않기 때문입니다. Emet에서의는 다음과 .ul>li*2>a var React = require('react'); var Header = React.createClass({ render: function () { return ( Home About ); } }); module.exports = Header; 2023: JSX/HTML 자동완성을 추가하는 간단한 방법:.jsReact 프로젝트의 파일... VSCode를 VSCode의.Ctrl+, (오류)Cmd+,(Mac 서서를를를서서는)★★..

programing 2023.02.23

리액트를 사용하여 여러 페이지 앱을 만드는 방법

리액트를 사용하여 여러 페이지 앱을 만드는 방법 jsreact js를 하여 한 웹 .사용한 적이 있다webpack모든 컴포넌트의 번들을 만듭니다.하지만 지금은 다른 페이지를 많이 만들고 싶어요.되어 있습니다. API 콜의 ,index.html의 콘텐츠를 표시했습니다.APIAPI의 데이터를 해석하는 다른 페이지에 콘텐츠를 삽입하고 싶습니다.은 「」입니다.bundle.js 「」의 은, 「」입니다webpack음음음같 뭇매하다 const webpack = require('webpack'); var config = { entry: './main.js', output: { path:'./', filename: 'dist/bundle.js', }, devServer: { inline: true, port: 3000 ..

programing 2023.02.23