总结/Vue

前端团队代码评审 CheckList 清单

前端团队代码评审 CheckList 清单前言前端团队有评审代码的要求，但由于每个开发人员的水平不同，技术关注点不同，所以对代码评审的关注点不同，为了保证代码质量，团队代码风格统一，特此拟定一份《前端团队代码评审 CheckList 清单》，这样代码评审人员在评审代码时，可以参照这份清单，对代码进行评审。从而辅助整个团队提高代码质量、统一代码规范。如果你的团队还没有这么一份代码评审 CheckList 清单，也许这正是你需要的；如果你的团队已经有了代码评审参照标准，这份清单也许能起到锦上添花的效果。一、代码静态检查工具1、使用 eslint 工具对 javascript 代码进行检查检查的规范继承自 eslint-config-standard 检验规则，具体的规则介绍参照链接：https://cn.eslint.org/docs/rules/ ，这里及以下部分不再重复介绍这些检验规则。2、使用 stylelint 工具对 css 样式代码进行检查检查的规范继承自 stylelint-config-standard 检验规则，具体的规则介绍参照链接：https://www.npm...

2019-07-09

50分钟阅读

Vue/教程/总结

前端优化

Object.freeze这算是一个性能优化的小技巧吧。在我们遇到一些 big data的业务场景，它就很有用了。尤其是做管理后台的时候，经常会有一些超大数据量的 table，或者一个含有 n 多数据的图表，这种数据量很大的东西使用起来最明显的感受就是卡。但其实很多时候其实这些数据其实并不需要响应式变化，这时候你就可以使用 Object.freeze 方法了，它可以冻结一个对象(注意它不并是 vue 特有的 api)。 当你把一个普通的 JavaScript 对象传给 Vue 实例的 data 选项，Vue 将遍历此对象所有的属性，并使用 Object.defineProperty 把这些属性全部转为 getter/setter，它们让 Vue 能进行追踪依赖，在属性被访问和修改时通知变化。 使用了 Object.freeze 之后，不仅可以减少 observer 的开销，还能减少不少内存开销。相关 issue。 使用方式：this.item = Object.freeze(Object.assign({}, this.item)) 这里我提供了一个在线测速 demo，点我。 通...

2019-05-09

5分钟阅读

Vue

Oxygen Music

2019.04.24 更新朋友界面，同网易云朋友栏目，更多内容虚登录， 2019.04.25 优化朋友栏目，增加验证码登录功能，

2019-04-25

2分钟阅读

Vue

Oxygen Music 2019-03-05更新

Oxygen Music(2019-03-05更新!)目前支持使用手机号及userID登录，获取网易云喜欢的音乐，歌单

2019-03-06

1分钟阅读

Vue/默认

OxygenMusic

Oxygen Music基于vue.js的音乐播放器,资源来至网易云音乐Demo:https://yun.yang143.cn本项目为移动端项目,pc端按F12调为手机模式查看，推荐使用手机查看，扫一扫二维码即可体验目标功能[x] 音乐播放、暂停 -- 完成[x] 播放列表、添加到播放列表、清空播放列表 -- 完成[x] 榜单 -- 完成[x] 歌手Top100、歌手详情页面 -- 完成[x] 搜索单曲、歌手、专辑 -- 完成[x] 热门搜索、搜索历史记录 -- 完成[x] 首页推荐(歌曲、歌单) -- 完成[x] 歌单 -- 完成[x] 我的收藏(歌单,歌手) -- 完成[x] 最近播放 -- 完成[ ] 歌词[ ] 搜索结果分类显示[ ] 切换播放模式[ ] 喜欢音乐[ ] 发现页面[ ] 侧边弹窗功能特性本项目所有数据来源网易云音乐，使用开源项目（NeteaseCloudMusicApi 网易云音乐 NodeJS 版 API）网易云音乐16个音乐排行榜网易新歌速递网易精选歌单，最新歌单本地收藏歌单，歌手，随时查看本地存储最近播放，最大存储99首，超过自动删除最早播放的歌曲搜...

2019-02-09

22分钟阅读

Vue

Vue-wechat(2018/12/10)

Vue+axios+muse-ui+vue-lazyloaddemo: https://blog.yang143.cn/视频演示: https://yun.yang143.cn/s/tf59vamvGithub： https://github.com/Jonathan143/vue-wechat主要特性界面布局大致模仿微信聊天页面,自动回复调用一言API聊天页面聊天记录采用 localstorage 存储;我的栏目里的相册里的图片均来自干货集中营,调用干货集中营API；使用vue-lazyload插件，实现图片懒加载；朋友圈顶部封面为必应每日美图，每日动态更换；...更新时间2018/12/10 修复聊天界面小bug,添加时间显示，1分钟间隔，超过1分钟发消息，动态添加时间模块，时间当前发消息时间；2018/12/09 更新，支持聊天回复，聊天回复调用一言api接口，聊天记录采用localstorage存储；2018/11/28 上传至 github2018/11/08 初建项目效果图鸣谢Vue.jsaxiosvue-lazyloadsassMuse-uihitokoto - ...

2018-11-16

6分钟阅读

Vue

Vue项目(一)

项目地址vue做的是手机端，电脑请F12切换手机模式访问基于vue+axios+vuex+Vant组件库瞎jb乱写的，好多功能没有实现，布局看心情...功能看心情...(也没啥功能...)演示视频地址（可在线预览）https://yun.yang143.cn/s/dd98ywad新闻和相册里的默认分类是都是静态资源，相册里的美图（福利）调用的是干货集中营的api

2018-11-16

2分钟阅读

Vue

vue.js学习(一）

vue.js渐进式JavaScript 框架基本指令v-textv-htmlv-showv-ifv-elsev-else-ifv-forv-onv-bindv-modelv-prev-cloakv-oncev-text详细：更新元素的 textContent。如果要更新部分的 textContent ，需要使用 {{ Mustache }} 插值。示例： {{msg}}v-html详细：更新元素的 innerHTML 。注意：内容按普通 HTML 插入 - 不会作为 Vue 模板进行编译 。如果试图使用 v-html 组合模板，可以重新考虑是否通过使用组件来替代。示例：``v-show用法：根据表达式之真假值，切换元素的 display CSS 属性。当条件变化时该指令触发过渡效果。示例：Hello!v-if用法：根据表达式的值的真假条件渲染元素。在切换时元素及它的数据绑定 / 组件被销毁并重建。如果元素是 ，将提出它的内容作为条件块。当条件变化时该指令触发过渡效果。示例：在字符串模板中，比如 Handlebars，我们得像这样写一个条件块： {{#if ok}} Yes...

2018-11-05

4分钟阅读