React designing component

を作成する構成部品の名前と使用するタグを入力します.tag後back-tickとして定義() 안에 스타일 속성을 정의하면 됩니다. const Title = styled.h1)
font-size: 1.5em;
text-align: center;
`;

既存の構成部品のスタイルプロパティを継承して新しい構成部品を作成する場合は、既存の構成部品をスタイル()で囲み、変更する新しいプロパティを定義します.
const TomatoButton = styled(Button) color: tomato; border-color: tomato; ;

要素を定義する場合、状況に応じて(新しい要素を作成するか、既存の要素を継承するか)温度が決定されます.または()のいずれかしか使用できません.

propsでスタイルプロパティを渡すか、関数でpropsで渡すプロパティを使用するか、defaultプロパティを使用します.
const Input = styled.input color: ${(props) => props.inputColor || "red"} ; ;

function App() {
return (

<div>
  <Input inputColor="blue" />
</div>

);
}
userefの説明の選択
useRefはDOM要素に焦点を当てる必要がある場合に使用します.DOM領域の特定の方法を使用する必要がある場合、userefはよく使用される.これはreactからDOM領域に直接アクセスする方法が限られているためである.
userefの初期値(userefの最初のパラメータ)には任意の参照タイプを指定できますが、DOMセグメントまたはreactセグメントにはアドレス値を指定できます.
ほとんどの場合、アプリケーションで変更された値はusStateとして指定して使用します.userefの戻り値は、構成部品が再レンダリングされないため変化します.
refプロパティを使用すると、DOMセグメントとreactセグメントのアドレス値をユーザーrefの戻り値に渡すことができます.