羽丫头不乖 - 博客园

2020年12月29日

摘要：需求：仅记录Lsee常用变量与方法定义，便于使用。…… @color: #000; @title-color: #000; @bg-color: #fff; @small-font: 12px; @large-font: 24px; .set-layout(@f, @j, @a){ display: 阅读全文

posted @ 2020-12-29 10:20 羽丫头不乖阅读(256) 评论(0) 推荐(0)

2020年12月17日

js 获取树结构的节点深度

摘要：需求：获取树结构的节点深度。实现util.js： // 获取节点深度参数为树结构array function getMaxFloor(treeData){ let deep = 0; function eachData(data, index) { data.forEach(elem => { 阅读全文

posted @ 2020-12-17 20:46 羽丫头不乖阅读(2961) 评论(0) 推荐(0)

vue 树形数据增加属性并计算树节点的深度

摘要：需求：在一组菜单树结构中转换数据结构（增加一些属性），并计算该树结构的节点深度。实现util.js： function transferTreeData(arr, vm, list, level, deep={maxLevel: 0}){ if(Object.prototype.toString. 阅读全文

posted @ 2020-12-17 20:39 羽丫头不乖阅读(1400) 评论(0) 推荐(0)

2020年11月2日

使用伪类(::before/::after)设置图标

摘要：使用伪类(::before/::after)设置文本前后图标。减少标签的浪费，使页面更加整洁。如图： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> .box{ 阅读全文

posted @ 2020-11-02 14:06 羽丫头不乖阅读(1282) 评论(0) 推荐(0)

2020年10月29日

vue+vuex 修复数据更新页面没有渲染问题

摘要：不解：为什么在关闭开关后，已经将data里的属性和vuex属性初始化后，页面就是不响应？？？问题：由于切换路由后，获取到vuex的数据在created中赋值到data相对应的属性中，在关闭开关后请求接口将vuex和data里的属性全部初始化，数据变更成功页面不渲染。（接口只做请求，不做数据返回阅读全文

posted @ 2020-10-29 17:18 羽丫头不乖阅读(3199) 评论(0) 推荐(0)

2020年10月22日

移动端评论区页面设计

摘要：需求：评论界面样式设计。 PS：界面比较粗糙，参考的朋友可自己细化。实现如下图：代码： 1 <template> 2 <div class="ym-comment"> 3 <div class="comment-title"> 4 <p> 5 <span>游戏评论 <em>共<i>3</i>条< 阅读全文

posted @ 2020-10-22 19:16 羽丫头不乖阅读(516) 评论(0) 推荐(0)

导出文件，responseType设置了blob，实际返回了JSON格式的错误信息的处理方式

摘要：下载Blob流文件，成功和错误提示返回信息的方法记录；文件转换：文件转二进制，文件转base64。阅读全文

posted @ 2020-10-22 15:13 羽丫头不乖阅读(3855) 评论(0) 推荐(0)

2020年10月20日

vue 页面生成图片保存

摘要：需求：将页面中的元素转成图片，支持保存或下载。要求下载的图片包含页面背景，头像，用户名，文本为“我的邀请码”和个人二维码。实现：将页面绘制到canvas中，生成base64图片链接，支持移动端的长按保存图片。技术与插件：vue，qrcodejs2，html2canvas，nutUI 示例：以下将阅读全文

posted @ 2020-10-20 14:27 羽丫头不乖阅读(5449) 评论(0) 推荐(0)

2020年5月7日

css实现0.5像素的底边框。

摘要：由于设计图的1px在移动端开发中的像素比是2倍，在实际开发中却是需要1px的线条，虽然最直接的方式是将线条设置为0.5px，但有些移动端对于0.5px的解析为0，变成了无边框的显示。因此处理该需求我们可以使用css3提供的缩放属性和伪类选择来实现1px。例： html: <div class="b 阅读全文

posted @ 2020-05-07 15:21 羽丫头不乖阅读(623) 评论(0) 推荐(0)

2020年4月23日

web之面试常问问题：如何实现水平垂直居中？

摘要：前提准备，在HTML页面中定义一个div,div中内容自定义。 <div class="box sc">致我们呼啸而过的青春</div> 样式： div.box{ width: 300px; height: 200px; background-color: peachpuff; } 此处的sc用于居阅读全文

posted @ 2020-04-23 19:26 羽丫头不乖阅读(297) 评论(0) 推荐(0)