大家好
方便幫我釐清一個 dropdown 選單的問題嗎?
我正試著用 typescript 和 reactjs 實現 W3School 上面這篇文章提到的 css
dropdown navbar
https://www.w3schools.com/howto/howto_css_dropdown_navbar.asp
但是為了練習駕馭 CSS, 我沒有完全參考上面連結的做法, 以下是我原始碼的連結, git
分支是 dropdown-in-navigationBar
https://github.com/youjenli/ui-widgets-practice-with-reactjs.git
現在的問題是 React 元件 TopNavigationWithDropdownMenu 沒辦法在我點擊 News 選單
的時候顯示 dropdown menu... 也就是它包覆的 React 子元件 Dropdown
因為沒有什麼錯誤訊息的關係, 所以我沒辦法掌握問題源頭, 請問大家方便幫我看一下為
什麼會這樣嗎?
考慮到這問題可能是由某些我還不清楚的程式碼或 CSS 關係造成, 因此我才把乾脆把整
個專案丟上來, 若造成困擾就不好意思啦~
你可以透過下列指令啟動專案
下載專案
git clone -b dropdown-in-navigationBar
https://github.com/youjenli/ui-widgets-practice-with-reactjs.git
下載依賴套件
yarn install
啟動開發環境
gulp watch serve
先感謝大家協助囉~
--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 1.169.224.151
※ 文章網址: https://www.ptt.cc/bbs/Ajax/M.1523030069.A.347.html
※ dream1124:轉錄至看板 Web_Design 04/06 23:55
問題解決了~
後來發現下拉選單不是未出現, 只是很大一部分被先前用來使選單列現形的
overflow:hidden 設定切掉
這問題只要改成用 flexbox 排版即可搞定
※ 編輯: dream1124 (1.169.224.151), 04/07/2018 22:50:57