반응형

reactjs 24

모바일에서 리액트 앱 미리보기를 만드는 방법

모바일에서 리액트 앱 미리보기를 만드는 방법 나는 그것을 사용하고 있다.create-react-app하려면 , 「 」를 참조해 주세요.yarn start를 버를에서 http://localhost:3000/URL을 사용합니다.모바일에서 앱을 미리 볼 수 있도록 하려면 어떻게 해야 하나요? 먼저 데스크톱 브라우저(최소한 Chrome 및 Firefox)에서 모바일 보기를 열 수 있습니다.상세한 것에 대하여는, 기사를 참조해 주세요.실제 모바일 디바이스에서의 테스트를 대체하는 것은 아니지만 보다 명확한 문제를 식별할 수 있습니다. 둘째, 로컬 네트워크에서 컴퓨터의 IP 주소를 사용해야 합니다(모바일 장치가 데스크톱과 동일한 네트워크에 있다고 가정). 와 에서는, 의 를 할 수 있습니다.ifconfig 「」를 사..

source 2023.04.01

'react'에서 반응하는 import *와 'react'에서 반응하는 import react의 차이점은 무엇입니까?

'react'에서 반응하는 import *와 'react'에서 반응하는 import react의 차이점은 무엇입니까? 저는 리액트나 코딩 배경은 전반적으로 처음입니다.그리고 두 진술의 차이가 무엇인지 잘 모르겠습니다. import * as react from 'react' 그리고. import react from 'react' 잘 부탁드립니다!가장 일반적으로 사용되는 수입품에는 세 가지 유형이 있습니다. 유형 1 import * as A from 'abc'; 그러면 abc에서 export로 표시된 모든 것이 Import됩니다.아래 코드를 사용하여 액세스할 수 있습니다. A.Component 유형 2 import {A} from 'abc'; 다음과 같은 것을 포함한 A를 abc에서 Import합니다. ex..

source 2023.04.01

후크를 사용하여 어레이에서 객체 삭제(useState)

후크를 사용하여 어레이에서 객체 삭제(useState) 나는 여러 가지 물건을 가지고 있다."this" 키워드를 사용하지 않고 어레이에서 개체를 삭제하는 함수를 추가해야 합니다. 는 는는그용사 i를 사용해 보았다.updateList(list.slice(list.indexOf(e.target.name, 1)))이렇게 하면 어레이의 마지막 항목을 제외한 모든 항목이 삭제되고 이유는 알 수 없습니다. const defaultList = [ { name: "ItemOne" }, { name: "ItemTwo" }, { name: "ItemThree" }] const [list, updateList] = useState(defaultList); const handleRemoveItem = e => { update..

source 2023.04.01

리액트 훅 + WebSockets의 올바른 사용 방법

리액트 훅 + WebSockets의 올바른 사용 방법 WebSockets 서버에 연결하여 메시지를 기록해야 합니다.React 클래스 컴포넌트를 사용하여 이 논리를 삽입합니다.componentDidMount라이프 사이클 훅을 사용하여 즐겁게 이행할 수 있지만, 어떻게 훅을 사용하여 적절히 구현해야 할지 잘 모르겠습니다. 제 첫 번째 시도는 이렇습니다. import React, {useEffect} from 'react'; export default function AppWs() { useEffect(() => { let ws = new WebSocket('wss://ws.kraken.com/'); ws.onopen = () => console.log('ws opened'); ws.onclose = () =..

source 2023.03.27

Reacjs 프로젝트 구축 후 불투명도 값이 1%로 변경됨

Reacjs 프로젝트 구축 후 불투명도 값이 1%로 변경됨 Reactjs 프로젝트를 만들고 css 대신 sss를 사용하고 있습니다.App.scss 파일에서 불투명도를 87%로 설정했습니다(참고: 단위는 퍼센트입니다). 명령어를 실행하면 모든 것이 정상적으로 동작합니다(불투명도 값은 87%입니다).실 시작 그러나 명령어를 실행할 때, yarn build와 파일 build/static/css/main의 값의 불투명도를 확인합니다.86352307.css. 그 후 불투명도 값이 1%로 변경되었습니다. 파일 App.scss: .App { text-align: center; opacity: 87%; } 빌드 후 프로젝트:파일 빌드/스태틱/css/메인86352307.css .App{text-align:center;o..

source 2023.03.27

React.js는 체크박스 상태를 변경할 수 없습니다.

React.js는 체크박스 상태를 변경할 수 없습니다. 이 간단한 TODO 목록을 만들었는데 체크박스를 켜고 싶을 때 할 수 없습니다. import React from 'react'; const TodoItem = React.createClass({ render() { return ( {this.props.todo} ); } }); export default TodoItem; 부모: import React from 'react'; import TodoItem from './TodoItem'; import AddTodo from './AddTodo'; const TodoList = React.createClass({ getInitialState() { return { todos: [{ todo: 'some..

source 2023.03.22

스타일링 리액트 네이티브 피커

스타일링 리액트 네이티브 피커 리액트 네이티브 선택기에서 항목의 텍스트 색상을 스타일링하려고 합니다.지금까지 iOS에서만 일했는데 크로스 플랫폼 솔루션을 찾을 수 있다면 정말 좋을 것 같아요. 나는 다음과 같은 것을 시도했다. 피커의 스타일링 색상 선택 항목의 스타일 색상 색채를 추가하는 예도 봤고 그래서 이걸 해봤어요. 여기서 완전히 망했어통찰해 주셔서 감사합니다! 편집: 다음은 해결책입니다. 선택 도구 요소에 있는 itemStyle 프로펠러를 사용하십시오.iOS 전용인 것 같습니다. 색상을 변경하려면 다음을 사용해야 합니다. 텍스트 색상, 배경색, 글꼴 크기 및 여백 및 패딩과 같은 기타 기타 기타 항목을 변경하려면 다음과 같이 "항목 스타일"을 사용하십시오. {cityItems} 선택 도구 주위에 ..

source 2023.03.22

create-react-app을 TypeScript와 함께 사용할 수 있습니다.

create-react-app을 TypeScript와 함께 사용할 수 있습니다. TypeScript를 사용할 수 있습니까?create-react-app만약 그렇다면 어떻게 하시겠습니까?다음과 같이 할 수 있습니다. create-react-app my-app --scripts-version=react-scripts-ts https://github.com/wmonk/create-react-app-typescript 를 참조해 주세요. 이 경우 이젝트할 필요가 없습니다.방법은 다음과 같습니다. # update create-react-app first npm update -g create-react-app create-react-app my-app --typescript Create React App v2.1...

source 2023.03.22

Respect Router v4 루트가 작동하지 않음

Respect Router v4 루트가 작동하지 않음 저는 반응하는 것이 비교적 처음이라 어떻게 반응 라우터를 작동시킬지 고민하고 있습니다.다음과 같은 매우 간단한 테스트 앱이 있습니다. import React from 'react'; import ReactDOM from 'react-dom'; import {BrowserRouter as Router, Route, Switch, IndexRoute, Link} from 'react-router-dom'; const Home = () => Click Me const About = () => About Us const Test = () => ( ) ReactDOM.render(, document.getElementById('app')); 앱을 실행하면 홈 ..

source 2023.03.22

"proposal-numeric-separator" 플러그인을 찾을 수 없습니다.

"proposal-numeric-separator" 플러그인을 찾을 수 없습니다. 수정 방법Could not find plugin "proposal-numeric-separator"React 어플리케이션을 빌드하려고 할 때 이 오류가 발생하지만 아직 어플리케이션을 이젝트하지 않았습니다. ./src/index.js Error: [BABEL] /home/pc/Downloads/project/src/index.js: Could not find plugin "proposal-numeric-separator". Ensure there is an entry in ./available-plugins.js for it. (While processing: "/home/pc/Downloads/project/node_mod..

source 2023.03.17
반응형