copetit / whereareyou

for our family
1 stars 1 forks source link

項目のリファクタリングを行う(フォームの機能実装が終わってから) #60

Closed copetit closed 2 years ago

copetit commented 2 years ago

やること

以下のコメントをissue化しました。

[IMO] 全体的にこのままだと、Reactの良さが見えないと思います。 textarea / input などは繰り返して利用されるいるため、 Component化してもよさそうです。

例えば、

const TestComponent = ({ name, type, inputName }: any) => {
  return (
    <label className="form-label">
      {name}
      {/* カレンダを入れる */}
      <input className="text-input" type={type} name={inputName} />
    </label>
  );
};

と書いておくと 下の

        <label className="form-label">
          離れた日
          {/* カレンダを入れる */}
          <input className="text-input" type="text" name="LostDate" />
        </label>
        <label className="form-label">
          離れた場所
          <input className="text-input" type="text" name="Address" />
        </label>

こことかはもう

        <TestComponent name="離れた日" type="text" inputName="LostDate" />
        <TestComponent name="離れた場所" type="text" inputName="Address" />

2行だけでいいと思います。

_Originally posted by @SHY-KG in https://github.com/copetit/whereareyou/pull/55#discussion_r773157801_