如何使用语义用户界面反应下拉菜单

Question

[我正在尝试将语义UI反应与typescript一起使用以创建表单。所以我正在使用文档。但是，当我实现dropdow或表单时，我得到了没有CSS的基本HTML表单。如何获得与react.semantic-ui.com相同的UX]

import { Dropdown } from 'semantic-ui-react'
const options = [
   { key: 1, text: 'Location 1', value: 1 },
   { key: 2, text: 'Location 2', value: 2 },
   { key: 3, text: 'Location 3', value: 3 },
 ]

return (

    <Form>

       <div>
       <Dropdown
       placeholder='Etat *'
       title="Select Etat"
       fluid
       selection
       options={StatusOptions}
       />
       </div> 

</Form>

[我正在尝试将语义UI反应与typescript一起使用以创建表单。所以我正在使用文档。但是，当我实现dropdow或表单时，我得到了没有CSS的基本HTML表单。 ...

Answer 1

您需要使用npm npm i semantic-ui-css安装默认主题

Answer 2

类似于Fayeed的上述回答。您可以在index.html的标题标签中导入CSS CDN。

例如：