vue模仿今日头条为了增加移动端项目的体验，最近一周通过vue模仿今日头条。以下总结项目实施过程中遇到的问题及解决方案。怎么了？地方，恳请大家批评指正^_^！，代码仓库地址为github1.实现功能首页展示查看新闻图片懒加载滑动标签，切换频道，点击频道切换不同的新闻点击标签的+按钮添加和删除频道点击搜索按钮并输入关键字，回车实时搜索，在结果中高亮显示关键字，点击导航栏刷新按钮只实现按钮的旋转效果，不实现页面刷新加载功能。效果如下：使用弹性布局，部分代码实现如下：{{item.title}}2.2问题：img水平排列设置display:inline-block时，有默认gap解决方法：在父元素中添加font-size:0；2.3问题：导入vuexstore时vue入口文件main.js不起作用解决方法：store无大写2.4问题：移动端通过控制根元素的font-size值实现设备适配时，块级元素始终有一个默认宽度解决方案：我的理解是根元素始终有一个font-size值，块级元素继承font-size，所以重置font-size可以改变元素的高度2.5问题：点击某个元素，元素会旋转360°解决方法：类rotate实现旋转动画.rotate{-webkit-变换样式：保留3d；-webkit-动画：x-spin0.7s线性；}@-webkit-keyframesx-spin{0%{-webkit-transform:rotateZ(0deg);}50%{-webkit-变换：rotateZ(180deg);}100%{-webkit-transform:rotateZ(360deg);}}2.7问题：按需加载组件（其他方法见参考资料）解决方法：{path:'/promisedemo',name:'PromiseDemo',component:resolve=>require(['../components/PromiseDemo'],resolve)}2.8问题：基于vue的实时搜索，在结果中高亮关键词解决方法：全能```replace```功能，searchKey为关键词title=title.replace(this.searchKey,`${this.searchKey}`)2.8问题：基于Vue的实时搜索，结果中高亮关键词解决方法：通用```replace```功能，searchKey为关键词title=title.replace(this.searchKey,`${this.searchKey}`)2.9问题：解决Android平台下输入标签被屏蔽的问题。当用户点击输入时，父元素向上移动，其他元素保持不变。ios下没有这个问题。解决方案：css部分：body{width:100%;高度：100%；溢出：滚动；}.container{宽度：100%；height:(这个是可选的，需要用js设置）；位置：绝对；顶部：0；js部分：varwinHeight=document.documentElement.clientHeight;$('.container').css('高度',winHeight+'px');2.10问题：懒加载解决方法：稍后添加引用https://segmentfault.com/a/11...组件按需加载https://router.vuejs.org/zh/g...路由懒加载https:///segmentfault.com/a/11...项目使用webpack对多个组件进行组合打包，实现按需加载
