Keyword 컴포넌트

[asdfqaz74]

KeyWord

키워드를 나열해주는 컴포넌트 입니다.

Method

• items
  recipes의 keyword를 기입해주시면 됩니다.

사용예시

<Keyword items="쌀국수, 고수가좋아, 고수가고수처럼고수먹방" />

전체코드

import separateComma from '@/util/separateComma';
import { Key } from 'react';

export default function Keyword({ items }: { items: string }) {
  const itemsString = items;
  const itemsArray = separateComma(itemsString);
  const sliceItemsArray = itemsArray.slice(0, 5);

  return (
    <div className="px-4 pt-4 gap-2 flex items-start self-stretch">
      {sliceItemsArray.map((item, index: Key) => (
        <div
          key={index}
          className="bg-tagColor rounded-[7px] flex px-1 py-6pxr justify-center items-center"
        >
          <p className="text-cap-1">{item}</p>
        </div>
      ))}
    </div>
  );
}