13日目/Layout

12日目ポートフォリオレビュー

コメントの削除

実行モードが必要な関数をクリックし、パスワードを受信した状態
削除ボタンにidを作成してid値を保存する必要があります
コメントリストの再構築が必要

アドレス登録

投稿登録コンテナ

onClickAddressSearchを起動すると、SetIsiopenはtrueになり、アドレス検索ウィンドウが開きます->SetIsOpenをStateと宣言し、デフォルト値はfalse
アドレスをクリックすると、onCompleteAddressSearchが->データを受信し、Stateにアドレスと郵便番号を格納し、データを受信し、SetIsOpenがfalseになります.
createBoardInputに取締役会アドレスを追加:{zipcode、address、addressDetail}
updateBoardInputにBoard Addressを入れる必要がありますが、Board Addressにはzipcode、addressDetailがあるのでupdateBoardInputです.Board Addressで包みます.

   if (zipcode || address || addressDetail) {
      updateBoardInput.boardAddress = {};
      if (zipcode) updateBoardInput.boardAddress.zipcode = zipcode;
      if (address) updateBoardInput.boardAddress.address = address;
      if (addressDetail)
        updateBoardInput.boardAddress.addressDetail = addressDetail;
    }

投稿登録プレゼンテーション

郵便番号(読み取り専用)、詳細住所(読み取り専用)、詳細住所(入力)
propsを使用してisOpenに移動し、ModelパッケージDaumPostCodeを使用します.
詳細アドレス(入力)はonChangeとして入力値を受信する必要があります
変更すると、必要なキャプチャボードから返される「詳細アドレス」(readOnly)データのdefaltValueがvalueに配置され、統合されます.
defaultValueは正しく動作しますが、値がある場合は最初に値を実行するので上書きされます.

Layout

UIのレイアウト

固定された部分をLayoutと呼びます.


複数のレイアウト

タイトル、バナー、ナビゲーション、ボディ
本体を変えるだけなので、ページコンポーネントにだけ入れたほうがいいですが、どうすればいいですか?
props.childrenを使います!

グローバルcssを使用すると、完全なcssを提供できます.
a hrefタグは、リフレッシュ時にページ移動するためよくありません.

Cascade Style-Sheet

スタイルを最上位の親に定義し、その子によって上書きされる構造.

右側のように親にスタイルを設定し、左側のようにスタイルを受け入れることができます.

ダウンロード

importをダウンロードするのに時間がかかるので、最初の画面は左のようにダウンロードして再レンダリングすれば見えます.
こんなことがあったら問題だよ.

FOITは可視コンテンツのみ提供
フォントがまだ受信されていない場合は、まずdefaultで表示され、すべて受信された場合はFOUTで表示されます.

圧縮率の高いフォントをダウンロード

同じフォントで圧縮率の高いフォント

軽量フォントをダウンロード

Subset-Font
フォント名+軽量化ダウンロードの検索

react-slick

docsを参照し、バナー部分でreact-slickを使用