在下拉組件中添加圖像和div

我試圖用Semantic和React自定義配置文件下拉組件，但我遇到了一些問題。 1.當我嘗試在Dropdown.Menu中放入一個div時，我的應用程序崩潰，出現下面的錯誤。 2.如何將自定義寬度添加到實際的下拉列表中？現在，當我將鼠標懸停在下拉菜單上時，它可以工作，但我希望能夠將鼠標懸停在圖像或下拉組件上，以便實際顯示下拉菜單。我試圖讓這puu.sh/tM6Ly/690a02bd46.png，但與一個圖像在一邊，如果可能的話，用圖像替換下拉箭頭。在下拉組件中添加圖像和div

<Dropdown simple={true} text="dropdown"> 
<Dropdown.Menu> 
    <Dropdown.Item>Profile 1</Dropdown.Item> 
    <Dropdown.Item>Profile 2</Dropdown.Item> 
    <Dropdown.Item>Profile 3</Dropdown.Item> 
    <Dropdown.Item>Profile 4</Dropdown.Item> 
</Dropdown.Menu> 
<div> 
    <img src="linkhidden"/> 
</div> 
</Dropdown>

引發錯誤onlyChild must be passed a children with exactly one child.和Invalid prop兒童supplied to下拉, expected a single ReactElement.

來源

2017-02-03 joethemow

試圖把裏面'' –

股利但是，這將圖像添加到下拉菜單項，這不是我想要做的事。我正在嘗試使用此https://puu.sh/tM6Ly/690a02bd46.png，但在圖像旁邊，如果可能，請用圖像替換下拉箭頭。 – joethemow

下拉supports的icon道具可以用來替代默認的箭頭圖標，你描述你在評論意向。只需在那裏通過你的替換。

<Dropdown simple={true} text="dropdown" icon={someNodeOrObject}> 
<Dropdown.Menu> 
    <Dropdown.Item>Profile 1</Dropdown.Item> 
    <Dropdown.Item>Profile 2</Dropdown.Item> 
    <Dropdown.Item>Profile 3</Dropdown.Item> 
    <Dropdown.Item>Profile 4</Dropdown.Item> 
</Dropdown.Menu> 
</Dropdown>

來源

2017-02-03 07:33:08

該圖標可能是自定義圖像嗎？我有一個鏈接到我的服務器上的圖像。 – joethemow

不確定。你有沒有嘗試傳遞圖像元素作爲圖標道具？ –

是的，我試圖通過img src鏈接作爲圖標，但我得到一個錯誤'提供給'Icon'的值的無效prop'name''。 – joethemow

在下拉組件中添加圖像和div

回答

相關問題