夏天好热啊~本文章举荐凋谢空调浏览便携式迷你小空调
因为采纳了黑科技,手机听筒放在脸庞能够有大风吹过,电脑端临时没有实现,后续会持续优化~.
tips:这个空调我的文章中也有哦~
以下是注释:
一.进一步优化用户体验
目前曾经实现了用户第一次拜访localhost:3000
会主动跳转到首页
然而右边的首页确并没有在首次渲染的时候被选中,能够看到并没有变为antd选中时的蓝色
这个解决也很简略,antd有封装好的API间接应用即可。
在<Menu>
组件应用现有的API即可。defaultSelectedKeys={[siderBarList[0].key]}
。至于外面的变量为什么写成这个,这个留给大家思考,如果有趣味,能够去查阅这个链接里的侧边栏渲染变量的定义。基于React.js的后盾管理系统开发全过程(五)
接下来就实现了进入主页主动渲染首页图标的UI色彩
到这一步不要认为功败垂成了,有个bug须要思考,像下面这样做,我不论在哪个列表,刷新,尽管页面还停留在role,然而一旦刷新就会从新UI图标在首页上,这并不是我想要的成果。
这里我采纳了极度不清真的手法来实现这个工作,尽管不举荐读者应用,然而成果是齐全能够实现的!
我在侧边栏组件内定义了一个变量path
来存储以后url的地址,并且将后面的dashiboard
地址替换成空字符串,这样就能够完满填写antd里的APIdefaultSelectedKeys={[path]}
即便我在user这个界面刷新,淡蓝色的背景色仍然会正确的渲染在user这里。
(>.<)尽管这个办法极度不清真,然而临时先这样吧,后续我会更新其它办法的。
----补充:目前曾经将,defaultSelectedKeys={[path]}
,改为selectedKeys={[path]}
因为default...只会在页面加载的时候渲染一次,而selected会动静的渲染。
先不谈网页,先讲一个额定的知识点,我并不心愿只是单纯的复述一些网页成果的实现。我更心愿的是,我能够通过这个我的项目来学习更多的额定常识,如果繁多的是为了后果而去实现,却遗记了带入本人的思考,那学习起来该多无趣。
在Material UI里应用的是jss的款式,它的写法和less那些预编译器大差不差,然而它是真正的在js文件里写款式的一个依赖,刚开始我也不习惯,然而写起来是真的难受。
首先咱们在Dashboard里创立一个style.js
的文件,把从官网复制的组件属性复制到这个外面。
先引入重要的一个外围勾子,makeStyles,