본문 바로가기
728x90
반응형

react4

eslint Error: A form label must be associated with a control. 에러 메시지 A form label must be associated with a control. eslint (jsx-a11y/label-has-associated-control) -> label은 input과 연관되어야 한다 에러 코드 이메일 에러 원인 htmlFor과 id로 연결해도 에러 발생 -> React에서는 컴포넌트 재상요으로 인해 id의 유일성 보장하기 못하기 때문 (map()으로 리스트를 만들 때 key값에 index를 넣었을 때도 비슷한 문제가 발생했었다) 해결 방법 2가지 [1] .eslint.json에 아래 내용 추가 { "rules": { "jsx-a11y/label-has-associated-control": [ 2, { "labelAttributes": ["htmlFor"] }.. 2023. 2. 16.
react 에러: React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: object 오류 메시지 Warning: React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: object. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports. Check your code at Main.js:17. 경고: React.jsx: 형식이 잘못되었습니다. 문자열(기본 제공 구성 요소) 또는 클래스/함수(복합 구성 요소)가 필요하지만, 객체를 받았습니다. 구.. 2023. 2. 2.
eslint 오류: Expected property shorthand eslint(object-shorthand) 발단 클래스 컴포넌트에서 board state를 같은 board로 변경해주는 커스텀 메서드를 선언하는 부분에서 eslint 에러 발생 this.state = { board: [], } getDetail = () => { this.setState({ board: board, }); } 에러 메시지 ES6 문법에서 좀 더 간단하게 표현할 수 있는 문법이 생겼다. 그걸 써라는 말임. Expected property shorthand eslint(object-shorthand) // es5 var foo = { x: x, y: y, z: z, }; // es6 var foo = { x, y, z }; // es5 var foo = { a: function() {}, b: function() {} }; // es.. 2023. 1. 31.
eslint 오류: State initialization should be in a constructor eslint(react/state-in-constructor) 발단 조금 예전 리액트 강의들을 따라하다보면 함수형 컴포넌트보다는 클래스형 컴포넌트를 사용한 것들이 많고, 클래스형 컴포넌트에서 state의 초깃값 정의 부분도 constructor() 생성자 함수 없이 그냥 곧바로 정의해주는 경우가 많았다. class Header extends Component { state = { buttonDisplay: "none" }; 에러 메시지 이는 eslint 오류를 발생시키는데, 바로, class 컴포넌트의 state의 초깃값 설정 부분은 constructor() 생성자 함수 안에 들어가야한다는 것이다 State initialization should be in a constructor eslint(react/state-in-constructor) 해결 state 초깃값.. 2023. 1. 31.
728x90
반응형