摘要： 责任链模式是一种行为型设计模式，它可以将请求沿着一条处理链进行传递，直到有一个处理器能够处理该请求为止。在前端开发中，责任链模式通常用于处理用户输入事件，例如点击、滚动等。 下面是一个简单的前端责任链模式案例，假设有一个页面上有三个按钮，分别对应“保存”、“提交”和“取消”操作。当用户点击某个按钮时 阅读全文

摘要： 1. WebStorm 按两下空格输入 soft wrap 进行换行 2. 第一个坑: svg 中的 fill 属性处理 svg 里面如果有 fill="",就会有颜色，可以手动去除,但是如果有很多个 svg 那么一个个去很麻烦 用 svgo loader 解决这个问题，在 vue.config.j 阅读全文

摘要： 1. 课前水平自测 要对 JS,CSS,SVG 非常了解才能造 UI 轮子 2. 没有需求就不要写代码,没有设计稿也不要写代码 没有设计稿就问设计要，不给就闹，把事情闹的越大越好，只要不写代码做什么都是对的 3. 单元测试是重构的前提 单元测试能保证大概率没有 Bug 4. 对于工具的使用,学 ES 阅读全文

摘要： 一. 大致的使用方法 二. 完成最外部的样式 三. 进一步调节样式 四. 默认内容折叠起来和点击切换，基本样式和基本功能完成 五. 完善功能第一个点开,第二个就关闭 因为结构比较简单，就父子两个组件，可以用父子通信来做。 六. 增加功能是否可以选择多个 方案一.用 single 变量是否需要控制 e 阅读全文

摘要： 1. 上一次的问题总结。 overflow:hidden body.appendChild 关闭重复 分开,document 只管外面,popover 只管里面 忘了取消监听 document 收拢 close 2. 可以把一个函数哟没有五行作为一个优化的标准,简称为五行定律 3. 接下来把样式改好 阅读全文

摘要： 1. 现在遇到的问题 如果在popover外面包了个div写上overflow:hidden就会出bug,所以要把弹出的div放到按钮的同一个层级 关于click事件的,之前解决的方式是写click.stop,但是其实还是会有bug,会打断用户的事件链，用户在外面写@click,点击按钮没有用，但是 阅读全文

摘要： 1. popover是什么以及难点在哪 点一下出现一个卡片,也叫气泡卡片 难点在于css的样式 2. 用户会怎么去用 3. 为什么要用用inline block，因为这样多个popover组件才不会一行 4. 优秀的前端css一定是写的很6的 5. 开始完善功能,实现点外面之后内容消失 6.解决第三 阅读全文

摘要： 1. 如果g tabs里面不是g tabs head，g tabs body期望会报错。 test里面也应该期待一个报错，通过google搜索chai expect error得到写法,但是又碰到报错是异步的问题,接下来我们又搜索 chai aysnc error 去解决,发现也没有办法解决，决定退 阅读全文

摘要： 1. 点击出现下划线的问题 2. 找到item之后开始做动画 mounted(){ this.eventBus.$on('update:selected', (item, vm) = { let {width, height, top, left} = vm.$el.getBoundingClien 阅读全文

摘要： 1. 为什么一个 new Vue 可以构造出一个 eventBus 2. 开始写 CSS 样式 3.激活属性 active 应该放在 data，还是放在 props 如果需要用户传值，就放到 props 里面，因为 props 是你的输入参数， data 不需要用户传值，自身维护值 4.在 moun 阅读全文