[21/07/31～08/01]統合検索画面

4246 ワード
今日の開発 テキストリンク

ざんりゅうさ


  • サーバ側から検索結果を取得して送信

  • skeleton UI

  • PagenationNavigator-SearchText構成部品重複除外

  • ProtTypeのアップグレード

  • 検索タイプ別Minimiコンポーネントの作成
    結果画面全体に数個しか表示されません


  • 検索タイプ別に構成部品に分解

    • 検索画面の実装


    グローバル・ステータスを使用しません.
    構成部品構造は、グローバルな状態を必要とするほど複雑ではありません.逆に開発コストが増加すると考えられていたため、Reduxは使用しないことを決めて実施した.
    検索結果をタイプごとに表示する機能が実装されました

    しかし、それは5つのファイルに分割されて実現されます.

    内部コードは5つのファイルと同じフォーマットですが、バックエンドでデータを提供するときの属性名が異なるため、組み合わせるのは難しいです.
    次のタスクは、この5つのファイルを1つのファイルに作成することです.

    に感銘を与える


  • バックエンドのプロパティにはそれぞれ違いがあり、一体化しにくいです.これはバックエンド開発者の問題というより、コミュニケーションの問題です.今後の開発では,他のデータでもデータの構造が似ていれば,同じ属性名で設計することが要求される.(もちろん、これは強要ではありません)

  • None素子の威力は非常に大きい.
    • // 감싼 텍스트가 None의 children으로 전달된다.
<None>검색 결과가 존재하지 않습니다.</None>
    //... molecules/None/index.js

import React from 'react';
import styled from 'styled-components';
import PropTypes from 'prop-types';
const NoneWrapper = styled.div`
  ...
`;
function None({ children }) {
  return <NoneWrapper>{children}</NoneWrapper>;
}

None.propTypes = {
  children: PropTypes.node,
};
export default None;
    検索画面機能を開発する場合、Noneコンポーネントを個別に作成する必要はありません.原子爆弾で設計されていなければ...数百個の素子があるかもしれませんが...ヒューヒューいう
    ブルーダ
    UnicodeとUTF-8の違い