더 나은 웹개발을 꿈꾸는 기술 블로그. 웹이즈프리.
총 5개의 일치하는 문서를 찾았습니다.
react[React] 컴포넌트에 사용할 태그를 변경하는 방법
React 앱 내부에서 사용할 컴포넌트의 태그를 다른 것으로 변경하는 방법을 알아봅니다.# react 컴포넌트 태그를 변경, 바꾸기 예를들어 기본값은 span 태그를 사용하되 옵션으로 div 태그를 사용할 수 있도록 변경이가능한 컴포넌트를 만드는 방법입니다.구현하기 위해서 아래와 같은 순서대로 수행하게 됩니다.1. 사용할 태그 요소를 props로 받음2. props가 없는 경우는 기본값 span을 사용함3. 변수 Tag를 선언 후 props 값을 적용그럼 아래에서 간단히 예제를 만들어보려 합니다.아래 예제는 myComponent를 불러와 사용합니다. 이때 div 태그...
Last Modified : 2020-11-06 07:55:11
Created : 2020-11-04 17:16:00- react
[React] 함수형 컴포넌트 에서 props를 사용하기, Functional Component
React 앱 개발시 클래스형, 함수형, 배열형 컴포넌트를 생성하고 사용하죠. 이 때 함수형 컴포넌트에서 Props를 전달 받아 사용하는 방법에 대하여 알아봅니다.! 함수형에서 Props 전달이 가능할까?당연히 가능합니다. 컴포넌트에서 부모와 자식 사이의 데이터를 전달하기 위한 다양한 방법 중 Props는 여전히 많이 사용되는 방법입니다.(@ Tips)다만 다른 프론트엔드 프레임워크와 달리 Props 사이의 데이터 흐름이 양방향(Two ways)가 아니므로 업데이트를 컴포넌트 사이에 전달하기에 필요한 부분이 존재하죠. 양방향은 편리한 만큼 성능 상의 이슈가 존재하는 ...
Last Modified : 2020-10-16 12:05:06
Created : 2020-07-06 19:11:54 - vuejs
[VueJS] 태그 이름 무시, vue 컴포넌트 제외하는 방법
VueJS에서 컴포넌트가 아닌 태그를 사용할 경우 에러가 발생합니다. 어떻게 하면 에러가 나타나지 않을까요?예를들어 <myTag></myTag>라는 태그를 웹페이지에 코드에 추가한다고 가정해봅니다.<div id="vueApp"> <myTag>Hi</myTag></div>VueJS에서는 myTag가 Vue에 등록된 태그라고 인식하고 찾기 시작할텐데요 ... 실제로 VueJS의 목적으로 생성한 태그가 아니므로 찾을 수 없어 에러가 나타날 것입니다. 이를 방지하기 위해서 config를 설정하는 방법...
Last Modified : 2020-01-06 20:41:50
Created : 2019-07-21 16:31:10 - webdevetc
모듈과 컴포넌트의 이해
모듈과 컴포넌트는 매우 중요한 개념이며 최근의 개발 디자인 패턴을 따르기 위해 반드시 이해해야만 합니다. 이 둘은 매우 비슷하지만 같지 않기 때문에 잘못 이해할 경우 혼동을 줄 수 있습니다.모듈과 컴포넌트의 공통적인 부분은 어떤 서비스의 공통화를 하기 위한 목적을 가지며 하나의 단위로 구분될 수 있습니다. 여기서 모듈은 개별 단위가 동작할 수 있는 기본 단위가 될 수 있다는 점이라면 컴포넌트의 경우 하나의 기능 역시 컴포넌트 단위로 나뉠 수 있습니다. 이런 이유로 모듈과 컴포넌트는 1:1 이 될 수도 있지만 1대 다가 될 수도 있습니다. # 모듈의 ...
Last Modified : 2017-08-16 17:04:48
Created : 2017-07-05 16:03:32 - webdevetc
웹에서 말하는 컴포넌트란 무엇인가?
웹 환경에서 일하다 보면 흔히 들을 수 있는 용어가 컴포넌트(Component)이다. 컴포넌트는 무엇을 의미하고 어떻게 다른지 알아보고자 한다.# 컴포넌트란?컴포넌트는 프로그래밍의 한 부분을 의미하며 재사용이 가능한 최소 단위를 말한다. 그래서 객체지향언어를 사용할 때 자주 사용되며 재사용이 가능하기 때문에 컴포넌트 단위로 분류하거나 이동 가능하다는 특징이 있다.이는 모듈(Module)과 혼동될 수 있는데 모듈은 특정 기능을 온전히 수행할 수 있도록 만들어 졌다면 그 모듈 내에서도 재사용이 가능한 단위가 컴포넌트라 할 수 있다.웹사이트를 구축할 경우 모든 것을 새로 ...
Last Modified : 2017-09-21 00:08:27
Created : 2015-12-02 08:14:51