发表于: 2017-06-10 21:57:04

1 669


今天完成的事情:继续昨天的进度,上午重点对找职位侧边栏hover后显示子列表的效果,并保持显示进行了调整。下午套用最新职位/推荐职位的代码,完成了职位搜索页的样式和功能的实现,修改了分页功能的布局,测试了每个单选项出现的结果是否和选择的一致。然后进一步完成了搜索总页,点击公司或者职位,下部页面进行路由跳转再渲染的功能。目前还是所属行业和学历选项的搜索结果有问题,等待后端师兄修复bug。截止写日志前,正在编写实现无搜索结果页的跳转和功能的实现,还有推荐职位或者推荐公司的数据请求。

明天计划的事情:完成无搜索结果页的显示,找职位顶部banner的数据请求和渲染,侧边栏点击选项进入职位搜索页显示相关搜索结果,找职位其他部分的数据请求。

遇到的问题:侧边栏子列表的实现,由于昨天日志中提到的,初始编写页面布局时,没有考虑好子列表的实现的方法,导致子列表是侧边栏的父级的兄弟级,不好简单通过hover的伪类实现子列表的出现和保持。后来想通过添加单选input[type:radio]的方法,但是需要使用label作为div的替代,不可行。最后没其他方法了,就对布局进行了大面积的处理,原以为不好改,因为选择器的权限嵌套比较厉害。后来发现,子列表的样式没有更多的嵌套,并不影响。然后就使用一个大div嵌套一个侧边栏+子列表的形式,完成了三个侧边栏的修改,最后通过添加大div的hover,关联子级,进行样式的修改和display的变化,实现了子列表的显示和保持显示。代码如下图所示:

收获:学习巩固了侧边栏子列表显示的效果,这个在CSS任务15时768px以下不是框架时,显示下拉的导航栏时用到过。实现了职位列表页的数据请求和渲染,已经巩固了二级路由的使用和传值。


返回列表 返回列表
评论

    分享到