提交選中的 Atlaskit Dropdown(@atlaskit/dropdown-menu) 菜單復選框，點擊項目

Question

我正在使用@atlaskit/dropdown-menu ( https://atlaskit.atlassian.com/packages/core/dropdown-menu )。 我想在Item單擊時提交一個小表單，我需要提交DropdownItemCheckbox值。

這是渲染所需組件的代碼： https : //codesandbox.io/s/py8qoo64mq

import React from "react";
import Dropdown, {
  DropdownItemCheckbox,
  DropdownItemGroupCheckbox,
  DropdownItem
} from "@atlaskit/dropdown-menu";

export default () => (
  <Dropdown defaultOpen triggerType="button" trigger="Drop menu">
    <DropdownItemGroupCheckbox id="languages2" title="Languages">
      <DropdownItemCheckbox defaultSelected id="js-check">
        JavaScript
      </DropdownItemCheckbox>
      <DropdownItemCheckbox id="java">Java</DropdownItemCheckbox>
      <DropdownItemCheckbox defaultSelected id="ruby">
        Ruby
      </DropdownItemCheckbox>
    </DropdownItemGroupCheckbox>
    <DropdownItem>Submit</DropdownItem>
  </Dropdown>
);

我不想使用Select因為我想用自定義按鈕觸發下拉列表，並使用 DropdownMenu 的分層優勢

Answer 1

我遇到了同樣的問題，經過大量研究，我發現問題是由 styled-components 包引起的，但如果版本 <=3.5.0-0，它可以工作。 所以我的解決方案是將 styled-components 包降級到 3.5.0-0。 這並不能解釋為什么它不起作用，因為它們只是樣式。 但目前這是一種解決方法。

在我提出問題后，Atlassian 向我發送了以下回復，我認為這些回復可以回答您的問題。

Atlaskit 不正式支持 styled-components v4 及更高版本。 我們目前要求我們的消費者根據我們的對等依賴使用 SC v3.2.6。 但是，最近有一些正在進行的工作將 Atlaskit 升級/遷移到更現代的 css-in-js 庫，目前我們正在內部完成決策過程。 請隨時關注此票以獲取狀態更新： https : //ecosystem.atlassian.net/browse/DS-6836