在我的應用程式中，如果選擇打開或關閉側導航選單，我希望容器的paddingLeft發生變化。
有一個變數open確定側導航是否打開。
我嘗試
了什么：渲染容器時，我添加了一個sx相應地設定填充的。
<Container maxWidth={false} className={classes.container}
sx = {{paddingLeft: open ? "theme.spacing(34)" : "theme.spacing(200)"}}>
然而，什么都沒有發生；沒有應用填充。
我是在濫用 sx 還是有辦法使用樣式標簽來做到這一點？
uj5u.com熱心網友回復：
theme是一個道具，這意味著你不能像使用雙引號的字串一樣傳遞它。嘗試改用字串插值。
<Container maxWidth={false} className={classes.container}
sx = {{paddingLeft: open ? `${theme.spacing(34)}` : `${theme.spacing(200)}`}}>
或者只是洗掉雙引號
<Container maxWidth={false} className={classes.container}
sx = {{paddingLeft: open ? theme.spacing(34) : theme.spacing(200)}}>
更新：修復未定義的主題。
<Container maxWidth={false} className={classes.container}
sx = {{ paddingLeft: (theme) => open ? theme.spacing(34) : theme.spacing(200) }}>
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/487771.html
標籤：javascript html css 反应 材料-ui
上一篇：為什么GSAP中的影片沒有反轉？