[React] Component 모듈화 . . 수정중
참고) component 모듈화
onChange를 쓰는데 왜 안되지? placeholder을 썼는데 왜 안되지? 했더니
input 컴포넌트를 모듈화하는 과정에서 props로 컴포넌트를 설정하면서 onchange, type, placeholder등 태그 관련 기능을 defaultProps로 넣어줘야 javascript에서 사용이 가능한 것 같다.
import styled from 'styled-components';
import React from 'react';
const Input = (props) => {
const { _onChange, type, placeholder } = props;
return (
<InputBox type={type} placeholder={placeholder} onChange = { _onChange } ></InputBox>
);
}
Input.defaultProps = {
_onChange: () =>{} ,
placeholder: "text",
type: "text",
width: "300px",
height: "30px",
borderRight: "none",
borderLeft: "none",
borderTop: "none",
borderBottom: "1px solid #BE01E5",
marginBottom: "10px",
}
const InputBox = styled.input`
width: 300px;
height: 30px;
border-right: none;
border-left: none;
border-top: none;
border-bottom: 1px solid #BE01E5;
margin-bottom: 10px;
`
export default Input;
Author And Source
이 문제에 관하여([React] Component 모듈화 . . 수정중), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@isabel_noh/React-Component-모듈화-.-.-수정중저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)