반응형

Reactjs 31

반응 유형 스크립트 - 유형의 인수를 유형의 매개 변수에 할당할 수 없습니다.

반응 유형 스크립트 - 유형의 인수를 유형의 매개 변수에 할당할 수 없습니다. 데모가 있습니다. Typescript와 훅을 사용하여 아래와 같이 간단한 형태로 엔트리를 캡처하는 리액트 앱입니다. 여기 Stackblitz에서는 동작합니다만, 로컬에서는 VS 코드를 사용하고 있기 때문에, 에러가 발생합니다.setUser(userData);에러는 const userData: { username: string; password: string; prevState: null; } Argument of type '{ username: string; password: string; prevState: null; }' is not assignable to parameter of type '(prevState: null)..

itsource 2023.03.23

Javascript의 Moment js를 사용하여 ISO 8601을 날짜 및 시간 형식으로 해석하는 방법은 무엇입니까?

Javascript의 Moment js를 사용하여 ISO 8601을 날짜 및 시간 형식으로 해석하는 방법은 무엇입니까? 현재 ISO 8601 문자열을 날짜와 시각으로 해석하기 위해 Moment js를 사용하고 있지만 제대로 작동하지 않습니다.내가 뭘 잘못하고 있지?그리고 저는 다른 쉬운 해결책도 택할 것입니다. 해석하는 ISO 8601:"2011-04-11T10:20:30Z"문자열의 최신 상태로:"2011-04-11"및 문자열의 시간:"10:20:30" 그리고 시도했다console.log(moment("2011-04-11T10:20:30Z" ,moment.ISO_8601))그리고.console.log(moment("2011-04-11T10:20:30Z" , ["YYYY",moment.ISO_8601])모..

itsource 2023.03.23

ReactJS에서 클릭 이벤트를 수동으로 트리거하는 방법

ReactJS에서 클릭 이벤트를 수동으로 트리거하는 방법 ReactJS에서 클릭 이벤트를 수동으로 트리거하려면 어떻게 해야 합니까?사용자가 요소 1을 클릭하면 자동으로 클릭을 트리거합니다.input태그를 붙입니다. 콜백을 통해 기본 HTMLInputElement 객체에 대한 참조를 취득하고 참조를 클래스 속성으로 저장한 후 이 참조를 사용하여 나중에 HTMLlement.click 메서드를 사용하여 이벤트 핸들러에서 클릭을 트리거할 수 있습니다. 고객님의 고객명render방법: this.inputElement = input} ... /> 이벤트 핸들러: this.inputElement.click(); 완전한 예: class MyComponent extends React.Component { render()..

itsource 2023.03.23

AuthError - 오류: 증폭이 올바르게 구성되지 않았습니다.

AuthError - 오류: 증폭이 올바르게 구성되지 않았습니다. 먼저 다음을 사용하여 리액트 응용 프로그램 구성을 완료했습니다.amplify configureAWS Amplify docs의 도움으로 그렇게 했습니다.그 후, 다음을 사용하여 인증확대 프로젝트에 성공적으로 추가했습니다.amplify add auth그리고.amplify pushAWS - Authentication with Amplify Doc의 모든 단계를 따랐습니다. 나의App.js이렇게 생겼는데 import React from 'react'; import { withAuthenticator, AmplifySignOut } from '@aws-amplify/ui-react'; import Amplify, { Auth } from 'aws-..

itsource 2023.03.23

'버튼' 대화형 역할을 수정하는 방법은 초점을 맞출 수 있어야 합니다.

'버튼' 대화형 역할을 수정하는 방법은 초점을 맞출 수 있어야 합니다. 사용자가 선택할 수 있는 드롭다운 옵션 목록이 있습니다. 드롭 다운의 optinos 는, 다음의 태그로 작성됩니다. handleSelect(filter)} role="button"> {filter.name} 문제는 추가되어야 한다는 것입니다.tabIndex="0" or -1Eslint로부터의 에러를 수정합니다. 하지만 내가 추가할 때tabIndex=0, 내 버튼이 더 이상 작동하지 않습니다. 이 오류를 해결할 다른 방법이 있나요? 드롭다운 컴포넌트는 다음과 같습니다. {filterOptions.map((filter) => ( handleSelect(filter)} role="button"> {filter.name} ..

itsource 2023.03.23

리듀서로 액션을 디스패치할 수 있습니까?

리듀서로 액션을 디스패치할 수 있습니까? 리듀서 자체에 액션을 디스패치할 수 있습니까?프로그레스바와 오디오 요소가 있습니다.목표는 오디오 요소에서 시간이 업데이트될 때 진행 표시줄을 업데이트하는 것입니다.그러나 ontimeupdate 이벤트 핸들러를 어디에 배치해야 하는지, 또는 ontimeupdate 콜백에 액션을 디스패치하여 프로그레스바를 갱신해야 하는지 알 수 없습니다.코드는 다음과 같습니다. //reducer const initialState = { audioElement: new AudioElement('test.mp3'), progress: 0.0 } initialState.audioElement.audio.ontimeupdate = () => { console.log('progress', i..

itsource 2023.03.18

반응 재료의 값 가져오기-UI 자동 완성

반응 재료의 값 가져오기-UI 자동 완성 React Material-UI(https://material-ui.com/components/autocomplete/) 문서를 참조합니다. 데모 코드에서 option.title} style={{ width: 300 }} renderInput={params => ( )} /> 동작은 알 수 있지만, 선택한 값을 어떻게 얻어야 할지 모르겠습니다. 예를 들어 I want to use the private works.onChange선택을 바탕으로 몇 가지 행동을 할 수 있도록 하기 위해 이것을 지지합니다. 추가해 보았다onChange={v => console.log(v)} 하지만v에는 선택한 값과 관련된 내용이 표시되지 않습니다.패스를 사용하여 해결합니다.(event,..

itsource 2023.03.18

MUI의 CSS 자 선택기

MUI의 CSS 자 선택기 CSS에 이것과 동등한 MUI를 사용하여 스타일을 작성하려고 합니다. .deleted td { background: red } 하지만 MUI의 CSS에서 JS 방식으로 어떻게 해야 하는지 잘 모르겠습니다. 현재 가지고 있는 관련 토막은 다음과 같습니다. const styles = theme => ({ deleted: { background: '#eee' } }) 다음과 같은 스타일을 생성해야 합니다. .deleted td { background: red } @josh의 조언에 따라& deleted: { "& td": { background: "red" } } https://codesandbox.io/s/llmq5or1w7 import React from "react"; impo..

itsource 2023.03.13

React에서 빈 dom 요소를 정의하는 올바른 방법

React에서 빈 dom 요소를 정의하는 올바른 방법 선택적 매개 변수를 보냅니다.checkbox컴포넌트에 대한 프로펠러 내부: var checkBox = this.props.checkbox ? : null; 그리고 이렇게 표현합니다. ... {checkBox} ... 위에서 본 것처럼 변수에 null을 할당합니다.대신 빈 문자열을 할당할 수 있습니다.''같은 결과가 나온 것 같습니다. 어떤 게 적절한가요?null을 사용해야 합니다."와 같은 빈 문자열을 사용하는 경우 react는 빈 span dom 요소를 생성하므로 동일하지 않습니다. var label1 = My Label; // react generates a label element var label2 = null; // react doesn't ..

itsource 2023.03.13

추적: 노드 유형 SpreadProperty의 이름이 Object.isSpreadProperty에서 SpreadElement로 변경되었습니다.

추적: 노드 유형 SpreadProperty의 이름이 Object.isSpreadProperty에서 SpreadElement로 변경되었습니다. 리액트 앱을 기동하고 있습니다.웹팩 구성은 다음과 같습니다. 'use strict' const ExtractPlugin = require('extract-text-webpack-plugin') const HTMLPlugin = require('html-webpack-plugin') module.exports = { devtool: 'eval', entry: `${__dirname}/src/main.js`, output: { filename: 'bundle-[hash].js', path: `${__dirname}/build`, publicPath: '/', }, m..

itsource 2023.03.08
반응형