본문 바로가기

태그3

[VSCode] JSX에서 HTML 태그 자동 완성 VSCode에서 리액트로 개발을 하게 되면 JSX 문법을 사용할 때 태그가 자동완성이 되지 않는다 // 태그를 직접 작성 해야한다 ㅠㅠ 하지만 불편함도 잠시! 파일에 어떤 코드를 추가하기만 하면 태그 자동 완성이 된다 룰루 ~~ 방법 1. 맥 기준으로 fn 키를 누른 상태에서 f1을 누르면 뜨는 검색창에 setting을 입력해주고 Open Settings (JSON)을 클릭해서 들어가 준다 2. settings.json 파일에 들어가면 아래의 코드가 나올 텐데 "emmet.includeLanguages": { "javascript": "javascriptreact" } 코드를 안에 추가해주면 된다 { "workbench.colorTheme": "Dracula", "git.autofetch": true, .. 2022. 5. 31.
리액트[기초] props.children props.children 는 컴포넌트 태그 사이의 내용을 보여주는 역할을 한다 부모 컴포넌트에서 리액트 사이에 작성한 문자열을 MyComponent 내부에서 보여주려면 props.children을 사용해야 한다 // 부모 컴포넌트 import MyComponent from './MyComponent'; const App = () => { return 리액트; }; export default App; // 자식 컴포넌트 const MyComponent = (props) => { return( // 안녕하세요, 제 이름은 기본 이름 입니다. 안녕하세요, 제 이름은 {props.name} 입니다. // children 의 값은 리액트 입니다. children 의 값은 {props.children} 입니다. .. 2022. 5. 27.
[개인 프로젝트 error] Uncaught (in promise) TypeError: Cannot set properties of null (setting 'innerText') 에러가 나게 된 상황 날씨 위젯 프로젝트를 만들던 중 날씨 api를 통해서 데이터를 받아오는 작업을 하고 있었는데 콘솔에는 데이터가 잘 나오는데 innerHTML이나 innerText를 사용해서 화면에 데이터를 띄우려고 하면 아래의 사진처럼 오류가 났다 에러 해결 & 느낀점 // 에러코드(필요없는 부분 생략..) const map_name = document.querySelector('.weatherInfo'); map_name.innerHTML = `${temperature} @ ${place}`; // 수정코드(필요없는 부분 생략..) document.querySelector('.weatherInfo').innerHTML = `${temperature} @ ${place}`; 예전에 비슷한 오류가 났.. 2022. 5. 2.
728x90