在反應 js（功能組件）中單擊它時保持活動按鈕

Question

我想留在我點擊按鈕的部分，按鈕也留在背景和顏色中，讓我知道你在例如早餐或午餐或晚餐或...部分

const Categories = ({ categories, filter }) => {
  return (
    <div className="btn-container">
      {categories.map((categorie, index) => {
        return (
          <button
            type="button"
            className="filter-btn"
            key={index}
            onClick={() => filter(categorie)}
          >
            {categorie}
          </button>
        );
      })}
    </div>
  );
};

所有部分早餐部分奶昔部分

Answer 1

為此，您必須在另一個狀態下保存價值，然后運行此 map 方法

{categories.filter(name => name.includes(**anotherStatevalue**)).map((categorie, index) => {
        return (
          <button
            type="button"
            className="filter-btn"
            key={index}
            onClick={() => filter(categorie)}
          >
            {categorie}
          </button>
        );
      })}