—— 分享前端技术,记录生活点滴

一个空格告诉我

  本周开发任务有个需求,点击聊天列表某一条进入聊天详情,点击返回,要求能够返回聊天列表页上次查看的位置,简单来说就是钻取二级页面后返回还能定位到当前位置。这其实对于 Vue 开发者来说,无非就是使用 keep-alive 缓存页面,返回后不重新请求数据,思路清晰,开始着手行动。

1
2
3
4
5
6
7
<template>
<div id="app">
<keep-alive include="IndexInfo, MessageInfo">
<router-view></router-view>
</keep-alive>
</div>
</template>

  我在 keep-alive 组件中添加 include 属性,里面添加需要缓存的两个组件页(两个页面有此需求)的 name 值。看效果,IndexInfo 页成功实现,然而聊天页 MessageInfo 仍然会重新请求。我开始检查聊天页逻辑,没有发现问题,越检查越懵,整个人都不那么好,下班时间到,先吃饭,然后回来死磕!晚饭后我打开编辑器,重新整体审视代码,我尝试把此处的空格去掉:

1
include="IndexInfo, MessageInfo"

  MessageInfo 被缓存了。QAQ?!真是哭笑不得。书写代码我习惯在标点符号后添加空格,这是我认为的代码美观,也是很多人所推崇的写法,然而就是这么一枚小小的空格,让我排查许久甚至怀疑人生。其实在刚开始我也意识到会不会是因为空格,但是我不愿意做出改变,认为不至于,并且认为那样代码挤在一起,丑。从中感悟两点:

1. 改变习惯

  习惯可以成就一个人,亦可以淘汰一个人。你所认为好的习惯不一定适用于各个场景,你认为 jq 大法好,其实很多前端早已拥抱 Vue ,你认为将自己的积蓄存在银行比较安全,殊不知移动支付平台早已改变人们的理财习惯。一个不愿意改变自己固有思维的人,想法会越来越陈旧,甚至慢慢被社会所淘汰。及时作出调整,顺应环境,心情舒畅,生活美好。

2. 改变思路

  工作中遇到问题,不要一直往里钻去研究某一个细节(当然研究性的工作除外),因为我们的时间和精力是有限的,工作的周期要求也不允许我们长时间停滞不前,遇到这种情况,要及时复盘洗牌,换个思路重新审视,或者和同事朋友去探讨去请教,也许你就会发现,问题的源头也许就是不那么起眼的戏剧性错误罢了。

  那么你在工作中遇到问题没有思路的时候,是如何处理呢?

(END)

支付宝打赏 微信打赏

如果觉得我的文章对您有用,请随意赞赏 :)