반응형

reactjs 34

TypeScript를 사용하여 useState React Hook에서 유형 설정

TypeScript를 사용하여 useState React Hook에서 유형 설정 후크 기능(React v16.7.0-alpha)을 사용하기 위해 React with TypeScript 프로젝트를 마이그레이션하려고 하는데, 구조화되지 않은 요소의 타이핑을 설정하는 방법을 알 수 없습니다. 다음은 예를 제시하겠습니다. interface IUser { name: string; } ... const [user, setUser] = useState({name: 'Jon'}); 강요하고 싶다user유형 변수IUser제가 유일하게 성공한 시도는 두 단계로 나눠서 하는 것입니다.입력 후 초기화: let user: IUser; let setUser: any; [user, setUser] = useState({name: ..

programing 2023.03.31

「 」를 「 」를 「 」를 제스트 시험을 지원해주실 수 있나요?

「 」를 제스트 시험을 지원해주실 수 있나요? 제스트 유닛 테스트에서는 ColorPicker로 컴포넌트를 렌더링하고 있습니다.그ColorPicker하지만 2D 콘텍스트를 반환합니다.'undefined'시킵니다."Cannot set property 'fillStyle' of undefined" if (typeof document == 'undefined') return null; // Dont Render On Server var canvas = document.createElement('canvas'); canvas.width = canvas.height = size * 2; var ctx = canvas.getContext('2d'); // returns 'undefined' ctx.fillStyle ..

programing 2023.03.31

리덕스는 퍼브/서브 또는 옵서버 패턴으로 볼 수 있습니까?

리덕스는 퍼브/서브 또는 옵서버 패턴으로 볼 수 있습니까? 리액션.js, 즉 웹에서 몇 가지 튜토리얼을 마쳤습니다. 제가 본 비디오 튜토리얼의 일부인 redux는 완전히 처음입니다.자세히 알아볼수록 react.js의 초기 아이디어를 대체한다는 점에서 의미가 없어집니다.반응에서 구성요소는 워크플로우를 위에서 아래로 유지하기 위해 소품을 통해 전달될 수 있는 자체 상태를 가집니다. redux를 사용하면 어플리케이션 상태 전체를 글로벌하게 만들고 그 (글로벌) 상태를 조작하기 위한 액션을 정의해야 합니다.그러면 일반적인 자바스크립트 pub/sub 또는 옵서버 패턴 이외의 액션은 무엇일까요?아니면 제가 잘못 알고 있는 걸까요? - 해명을 해주시면 감사하겠습니다.Redx는 "react.js의 초기 아이디어를 대체..

programing 2023.03.31

ESLint: 'cy'가 정의되어 있지 않습니다(Cypress).

ESLint: 'cy'가 정의되어 있지 않습니다(Cypress). 리액트 타입 스크립트 프로젝트에서 사이프레스를 사용하기 시작했습니다.몇 가지 간단한 테스트가 있습니다. describe('settings page', () => { beforeEach(() => { cy.visit('http://localhost:3000') }); it('starts in a waiting state, with no settings.', () => { cy.contains('Waiting for settings...') }); it('shows settings once settings are received', () => { const state = cy.window().its('store').invoke('getStat..

programing 2023.03.26

실험 구문 'classProperties'에 대한 지원이 현재 설정되어 있지 않습니다.

실험 구문 'classProperties'에 대한 지원이 현재 설정되어 있지 않습니다. 장고 내에서 리액트(React) 프로젝트를 설정하던 중 이 오류가 발생했습니다. 모듈 빌드의 ModuleBuildError가 실패했습니다(./node_modules/babel-loader/lib/index.js).구문 오류:C:\Users\1Sun\Cebula3\cebula_react\assets\js\index.js: 실험 구문 'classProperties' 지원이 현재 활성화되어 있지 않습니다(17:9): 15 | 16 | class BodyPartWrapper extends Component { > 17 | state = { | ^ 18 | 19 | } 20 | Add @babel/plugin-proposal-..

programing 2023.03.26

Axios: 여러 API 요청 연결

Axios: 여러 API 요청 연결 Google Maps API에서 몇 가지 API 요청을 체인으로 만들어야 하는데, Axios에서 하려고 합니다. componentWillMount()에 있는 첫 번째 요구입니다. axios.get('https://maps.googleapis.com/maps/api/geocode/json?&address=' + this.props.p1) .then(response => this.setState({ p1Location: response.data })) } 두 번째 요청은 다음과 같습니다. axios.get('https://maps.googleapis.com/maps/api/geocode/json?&address=' + this.props.p2) .then(response ..

programing 2023.03.26

Jest 설정 "SyntaxError:예기치 않은 토큰 내보내기"

Jest 설정 "SyntaxError:예기치 않은 토큰 내보내기" 현재 테스트가 없는 기존 프로젝트에 테스트를 구현하고 있습니다.테스트가 컴파일되지 않습니다.node_modules/Imports(수입. /Users/me/myproject/node_modules/lodash-es/lodash.js:10 export { default as add } from './add.js'; ^^^^^^ SyntaxError: Unexpected token export at transformAndBuildScript (node_modules/jest-runtime/build/transform.js:320:12) at Object. (app/reducers/kind_reducer.js:2:43) at Object. (ap..

programing 2023.03.26

리액트 컴포넌트를 동적으로 작성하다

리액트 컴포넌트를 동적으로 작성하다 데이터와 함께 전달된 인수에 따라 다른 구성 요소를 렌더링하려고 합니다.일반 또는 React.createElement(Item)를 사용하면 정상적으로 동작하지만 다른 옵션은 모두 실패합니다. http://jsfiddle.net/zeen/fmhhtk5o/1/ var React = window.React; var data = {items: [ { itemClass: 'Item', id: 1, contentsHTML: '', text: 'Item 1'}, { itemClass: 'Item', id: 2, contentsHTML: '', text: 'Item 2'}, { itemClass: 'Item', id: 3, contentsHTML: '', text: 'Item 3'}..

programing 2023.03.26

반응-선택 포커스 테두리 제거

반응-선택 포커스 테두리 제거 초점이 맞춰져 있을 때 반응 선택에서 테두리 또는 윤곽(어느 것인지 확실하지 않음)을 제거하는 방법을 알 수 없습니다. 참조용 이미지를 업로드했습니다.기본적으로 테두리가 없습니다. customStyle = { control: provided => ({ ...provided, height: 10, width: 300, padding: 10, margin: 0, marginLeft: 0, border: "0px solid black", fontSize: 13, backgroundColor: 'white', outline: 'none' }) } 감사해요.반응 선택 v3 const style = { control: base => ({ ...base, border: 0, // Thi..

programing 2023.03.26
반응형