TIL/20210821

📌今日やったこと

フィードバック反映
18日~20日に3日間betaサービスを導入し、初めてのフィードバックを受けた.
約40人が真実のフィードバックを提供し、できるだけ二重重複の内容を反映することにした.
🎨反映リスト
特定のscrollheightの後にVコメントボタンを表示
Vビューの中央揃えを統一する
V検索窓でビール名を検索するときは黄色のフォント(最終的にはこれをしないことにしました)
Vリアルタイム自動完了結果を5個に減らし、検索モードウィンドウに表示する
Vライブの爽やかな味わいは全部で3点次の文を表示します.
V検索apiの適用
V検索ウィンドウでxキーを押すとパターンが消えない問題&英語の問題解決
それ以外にも多くのフィードバック処理があります.一番印象に残ったのは
ラベル検索結果にテキストが表示されます.

ラベルに関連するコンポーネントも作成され、beerlistコンポーネントに表示するには、ラベル署名をロードするのは難しいです.
したがって、BeerListには、クリックしたhashtag名、hashtagに関連付けられたビールリスト、他のhashtagをクリックしてクリックしたhashtag名の3つの関数が用意されている.jsは一緒に私に渡した.
BeerList.js

import { getHashtagList } from "../redux/reducer/beerSlice";
import {HashTagList} from "./BeerIndex";

const BeerList = (props) =>{ 
    const hashtag_beers = useSelector(getHashtagList); 
    const [hashtagName, setHashtagName] = useState(""); //검색할 해시태그명
    const [hashtag, setHashtag] = useState([]);//해당 해시태그로 검색한 결과
    
    const BeerLists = () => {
      return(
        <React.Fragment>
            {hashtag.length > 0 ?
             <HashTagList 
               setHashtagName={setHashtagName}
               hashtagName={hashtagName}
               hashtag={hashtag}
               setHashtag={setHashtag}
               hashtagName={hashtagName}
            ></HashTagList> // 해시태그리스트 출력
            : BeerLists() //검색 or 타입별 맥주 출력
          }
        </React.Fragment>
    )
}
export default BeerList;

HashtagList.js

import React,{useEffect} from "react";
import styled from "styled-components";
import EachBeer from "./EachBeer";

const HashTagList = ({ hashtag, hashtagName, setHashtagName }) => {

    useEffect(() => {
        window.scrollTo({
            top: 0,
        })
    }, [hashtagName]); //새로운 해시태그 누를때마다 페이지 맨위로 이동

    return(
        <React.Fragment>
            <HashTagSearchResultWrap>
            <span>
            <span style={{color:"#FFC44F",fontWeight:"700"}}>
                #{hashtagName}</span>
                으로 검색된 맥주는 총 
                <span style={{color:"#FFC44F",fontWeight:"700"}}>
                {hashtag?.length}
            </span>건입니다.
            </span>
            </HashTagSearchResultWrap>
            <List>                    
                {hashtag?.length > 0 ? hashtag?.map((item, idx) => (
                    <EachBeer 
                    page={"beerList"}
                    setHashtagName={setHashtagName}
                    key={idx} item={item} />
                )):""}
            </List>

        </React.Fragment>
    )
}

それ以外にも、非常に良いアイデアと改善すべき点をフィードバックしました.
私はすべての仕事を終えて、あなたにもっと良いマジックを見せます.🎉
cf.フィードバックを残した6人を選び、ギフト券を送った.
もっと多くの人にあげたいです.😂 もしあなたがフィードバックした友达に会ったら、私は彼らにコーヒーをおごらなければなりません.