tomorrownan的博客

私信 关注
tomorrownan
码龄3年

Hello,tomorrownan.

  • 360,577
    被访问量
  • 121
    原创文章
  • 17,696
    作者排名
  • 325
    粉丝数量
  • 于 2018-08-23 加入CSDN
获得成就
  • 获得314次点赞
  • 内容获得356次评论
  • 获得914次收藏
荣誉勋章
兴趣领域
  • #前端
    #HTTPS#WebPack#Flutter#Node.js#CSS#面试#JavaScript#React.js#TypeScript#ECMAScript 6#小程序#前端框架#XHTML#Vue.js
TA的专栏
  • 工具
    3篇
  • 前端
    25篇
  • JavaScript
    25篇
  • ES6
    8篇
  • Vue
    31篇
  • 小程序
    12篇
  • js算法
    6篇
  • Python
    8篇
  • git
    5篇
  • shell
    4篇
  • 前端性能提升
    4篇
  • 随笔
    2篇
  • 正则表达式
    1篇
  • Linux
    3篇
  • 最近
  • 文章
  • 资源
  • 问答
  • 课程
  • 帖子
  • 收藏
  • 关注/订阅

git版本回退到某一次提交

背景：今天一个前端女同事问我她如何才能回退到上一次她提交的版本。她网上找了方法，却没有起作用。问题虽然简单，但是还是记录下来，解决问题使用命令 git log查看提交记录，并复制下想要回退到那个版本的commitId，就是commit后面那一串编码序列。如下图：运行命令 git reset --hard 刚刚复制的commitId，就可以成功回退到那个版本。例如 ：git reset --hard 210b5ee81cd869d8f17309b4c8656a8816515398
原创
1004阅读
0评论
2点赞
发布博客于 11 月前

element-ui的table表格控件表头与内容列不对齐问题

背景：今天偶然发现饿了么的表格组件表头和内容列有点错位。如下：解决将下列样式代码添加到index.html、或app.vue中（必须是入口文件，起全局作用！）.el-table th.gutter{ display: table-cell!important; }问题已经解决，如下：...
原创
862阅读
0评论
1点赞
发布博客于 1 年前

Cannot read property 'disabled' of null 问题解决

使用vue-element框架的后台管理项目一直报Cannot read property ‘disabled’ of null 问题，截图如下：1. 问题定位看了下代码，找了很多解决方案，最后发现是因为注释了el-dropdown-menu下的代码，如下：因为不需要显示右上角图标，所以把那一部分代码注释了。引起了一直报上述错误，在页面中使用了el-dropdown，但是在这个标签里面没...
原创
2374阅读
0评论
1点赞
发布博客于 1 年前

javascript：在当前页面URL后追加参数并获取相关属性

往往单点登录和一些表单回显涉及到操作页面的URL。这里为了是第三方访问我司的项目时自动回显查询条件，因此需要在浏览器url处追加一些参数，然后再从URL中取出相关属性用于表单的回显和接口的请求。如下：追加参数var url_p = window.location.origin+window.location.pathname+'?campusId=2&managerid=B716B...
原创
1491阅读
0评论
0点赞
发布博客于 1 年前

axios请求“跨域”的解决方案

背景：困扰了好几个小时的问题。启动项目后，页面内容如论如何都不出现，接口没有请求成功。看了一下控制台报了下面错误。Access to XMLHttpRequest at 'xxx' from origin 'xxx' has been blocked by CORS policy: The value of the 'Access-Control-Allow-Origin' header ...
原创
2547阅读
0评论
0点赞
发布博客于 1 年前

Error: Cannot find module 'webpack-cli/bin/config-yargs’解决方案

年前的项目启动一直没有问题，一个月没有维护，一个月后再次npm run dev 启动时，命令行报错Error: Cannot find module 'webpack-cli/bin/config-yargs'解决方法探索首先我本地package.json中对应版本信息如下：有网经说是webpack3.x版本和webpack-dev-server3.x版本不兼容，但是我这webpa...
原创
20099阅读
6评论
3点赞
发布博客于 1 年前

forEach中执行return无法跳出函数的解决方案

遇到一个很奇葩的问题，只怪自己基础不牢靠。在写提交函数时对字段是否填入做一个判断。要求每一个字段都填如以后才可以触发保存函数，否则不执行保存函数。按照自己的习惯，我就顺手写了forEach循环，代码如下：handleSub() { this.fields.forEach((v) => { if (v.orderid === 0) { this.$message.err...
原创
1973阅读
0评论
0点赞
发布博客于 1 年前

刷新页面：provide和inject的使用

provider/inject依赖注入：在父组件中通过provider来提供变量，然后在子组件中通过inject来注入变量。这里不论子组件有多深，只要调用了inject那么就可以注入provider中的数据。而不是局限于只能从当前父组件的prop属性来获取数据。vue中使用方法在App.vue中定义provide函数。比如我这里的刷新页面的方法。<template> <...
原创
156阅读
0评论
0点赞
发布博客于 1 年前

git: push代码报错! [remote rejected]xxxx分支 -> xxxx分支 (failed to update ref)

问题重现我新建了一个功能分支，在push代码到远程时，报如下错误：其原因应该是我操作不当引起的，我在创建新分支时报了错误，原因是存在与新分支名称前缀相同的分支。如已存在的分支是：feature/test，我再次新建名称是feature/test/v1.01的分支时就会报错的。所以我删除了名称是feature/test的分支。然后成功新建了feature/test/v1.01分支。但是在向远程...
原创
1007阅读
0评论
0点赞
发布博客于 1 年前

根据菜单权限实现动态路由遇到的几个奇葩问题：1.cannot read propery 'range' of null 2.cannot find module

问题：1.cannot read propery ‘range’ of null2.cannot find module ‘@/views/xxxxx’,(由两种现象引起)背景在使用vue-element-admin模版的后台管理系统中，根据菜单权限实现动态加载路由，在把从后端接口取到的菜单拼接成前端路由需要的形式时遇到了以下几个问题。问题1与解决方法问题截图解决方法这个...
原创
526阅读
0评论
0点赞
发布博客于 1 年前

elementui:date组件将当前月份放在右侧

背景：公司要求展示今天之前的数据，使用picker-options的disabled把当前天后面的日期屏蔽掉，但是这样就出现一个展示问题。当前月份在左侧，右侧月份均不可以选择，非常不美观，如下。于是要把当前月份放在右侧显示。解决方法使用default-value属性设置默认日期。如下：<el-date-picker v-model="timeRange" type="date...
原创
531阅读
0评论
0点赞
发布博客于 1 年前

vue-admin:oauth2.0单点登录实现

背景：现在有一个需求是客户要求使用oauth2.0方式的单点登录进入系统，原先我们都是使用cas方式的单点登录。这里整理下代码：1.oauth2.0分为4个步骤：获取第三方token。为了安全性（不暴露第三方token和secretKey）,c此处是后端对第三方提供的API进行处理，前端只去公司后端提供的接口中拿token。拿到第三方token后，跳转到第三方认证平台。跳转到第三方...
原创
2043阅读
0评论
0点赞
发布博客于 1 年前

el-input和input输入框只允许输入数字小数点或某些字符

在表单验证中常常会有el-input和input输入框只允许输入数字小数点或某些制定字符的需求。实现方式也多种多样，element自带的表单验证和自定义验证器都可以实现，这里使用javascript的oninput事件，然后配上正则表达式，只需要一行就可以实现需求了。原理：oninput 事件在用户输入时触发。该事件在 <input> 或 <textarea> 元素的值...
原创
7263阅读
0评论
1点赞
发布博客于 1 年前

手写v项目中横向类tab（可展开与收起）功能

背景：在本次项目需求中涉及区域名称的展示，点击更多可以展开和点击收起即收起。项目框架：vue。设计如图：展开：element也有tab标签组件，有类似效果，这里决定自己手写一个原生的，点击事件也好控制。新建一个view页面，可以封装组件，再有其他地方使用时就可直接用。HTML部分1.展开与收起的动画是采用在点击事件中改变状态，根据不同状态写不同的样式来实现的。2.点击事件中传...
原创
337阅读
0评论
0点赞
发布博客于 1 年前

VsCode常用快捷键

全屏：F11zoomIn/zoomOut：Ctrl +/-侧边栏显/隐：Ctrl+B显示资源管理器 ：Ctrl+Shift+E显示搜索： Ctrl+Shift+F显示 Git： Ctrl+Shift+G显示 Debug ：Ctrl+Shift+D显示 Output ：Ctrl+Shift+U全局查找 ：Ctrl+Shift+F万能键：F1找到所有的引用： Shift+F12...
原创
164阅读
0评论
0点赞
发布博客于 1 年前

el-upload删除上传的文件: error in v-on handler TypeError: reqs[uid].abort is not a function

问题:使用elementui的el_upload组件上传文件，但是点击叉号上传的文件无法删除。报错如下：分析：查看源码的时候会发现http-request 这个传入的回调函数返回一个Promise。const req = this.httpRequest(options); this.reqs[uid] = req; if (req && req.then) {...
原创
1298阅读
0评论
2点赞
发布博客于 1 年前

vue-element-admin路由切换到添加或编辑页面后实现侧边栏高亮

背景：使用vue-element-admin的后台管理系统。添加和编辑页面使用路由跳转的方式切换，但是切换到添加页面后，添加功能所在页面对应的侧边栏不会高亮显示。如图当点击添加或者编辑按钮以后，左侧菜单不再高亮。分析：原模板中使用:default-active="$route.path"实现侧边栏的高亮。default-active指当前激活菜单的索引。因为这里添加和编辑页面路由的path...
原创
2509阅读
1评论
0点赞
发布博客于 2 年前

不用防抖节流解决表单连续点击提交

背景：前端的表单提交功能，理论上是点击一次请求一次接口也就提交一次，无奈测试会按住鼠标一直点击。然后也就一直向后端发送数据，前端也会显示多个提交成功的提交。影响体验。测试提出要一段时间内只可以提交一次。直接使用状态判断。解决：在全局data函数中定义一个状态变量，如下：在提交函数中通过变换subFlag变量的状态控制提交测次数。如下：submitSetting() { if (th...
原创
248阅读
0评论
0点赞
发布博客于 2 年前

根据日期获取对应的是星期几、判断数组类型

背景：前端有一个需求是展示日期和星期，ui设计如下：而后端接口只返回了日期，所以前端要根据日期得到该日期对应的星期。封装函数如下：getWeek(t) { const weekDay = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'] // Date.parse(t)：转化成时间戳 // new Date(Date.parse(t)): ...
原创
192阅读
0评论
1点赞
发布博客于 2 年前

表单验证:多个upload上传图片验证，并且上传成功后清除提示信息

在加上表单验证以后，必填项不填会有提示信息。像一般的input输入框，有正确内容输入后提示信息就会自动消失。但是el-upload上传图片以后提示信息依然还在。如下：解决方法在文件上传成功时的钩子函数on-success定义的方法中写一句清除验证器的代码既可以实现。如下代码：验证规则：上传文件成功的钩子函数定义的方法写上下面关键的一句上传图片后提示信息就已经清除：效果：...
原创
480阅读
0评论
1点赞
发布博客于 2 年前

element手动点击修改走马灯的播放索引

背景：项目中需求改成上方展示小区列表，下方是各校区数据的柱状图轮播，轮播到该校区时上方校区高亮。但是点击某一个校区也要展示该校区对应的柱状图，这里就用到了手动修改走马灯的播放索引。思路：element官方提供了setActiveItem方法，调用此方法可以改变当前播放的幻灯片。使用方法如下：<div class="bottom-box-right"> <div cla...
原创
1287阅读
0评论
1点赞
发布博客于 2 年前

"TypeError: Cannot read property 'xxxx' of undefined"报错的情况分析

报错如下：原因1模板渲染时出现问题，因为渲染的时候还没有拿到数据。又或者是后台返回的数据没有此字段，渲染时却使用了此字段。如下：为了重现报错，上述第二段删掉了v-if判断，因为后台接口返回的数组对象中只有一项（我以为是固定的三项，有时候接口返回会不规范），funnelData[1].count中的count就会未定义。添加上判断就不会有问题了。如下代码解析：原因2未初始化，就是没...
原创
1527阅读
0评论
0点赞
发布博客于 2 年前

封装函数：按数组中对象某字段的值从小到大排列

// 从小到大排列compare (item) { return (a, b) => { const val1 = a[item] const val2 = b[item] return val1 - val2 }},例如： data中定义的对象如下：data () { return { funnelData: [] } },...
原创
104阅读
0评论
0点赞
发布博客于 2 年前

封装函数：按照需要格式格式化时间

背景：后端返回的时间是时间对象，格式不是yy-mm-dd hh:mm:ss或者yy-mm-dd hh-mm-ss时间格式的，所以前端要对拿到的数据做一些处理才可以展示到页面上。这里将处理方式记录下来，方便以后直接拿来使用。如下：// 格式化时间，一位数不足两位 format(t) { if (t < 10) { return '0' + t } else { ...
原创
59阅读
0评论
0点赞
发布博客于 2 年前

input中type="number"类型去除上下箭头和禁止滚轮滚动改变数值

背景：在vue做后台管理系统项目中，会有一些表单需要验证，比如只能输入数字。有一种解决方法就是使用type="number"。由此也遇到了下面两个问题：1. 去除上下箭头写上type="number"后输入框右边会有上下箭头，影响视觉体验。可以使用下面方法去除：<style> input::-webkit-outer-spin-button, input::-webki...
原创
2249阅读
2评论
1点赞
发布博客于 2 年前

封装函数：数组对象中去除相同ID的项、递归找到所在ID的所有父级元素

记录下项目开发中遇到的两个实际需求。1.数组对象中去除相同ID的项从后台接口拿到的数据格式是数组对象，但是会存在前后调用同一个接口数据项重复的现象。导致页面中数据显示有重复的。所以在从接口取到数据以后，去除数组中有相同项的对象。比如我从接口拿到的数据如下：list: [ { mapcode: 7, name: '快鱼', price: 2 }, { mapcode: 8, na...
原创
708阅读
0评论
1点赞
发布博客于 2 年前

vue:动态菜单只有一个子菜单时父级菜单不显示问题

使用vue-admin-template后台管理模板的项目中使用了动态路由，就是显示后端接口返回的路由。第二次遇到父级菜单不显示的问题，第一次解决的方法没有记录，便又思考了一会。这里记录下。父级菜单下有多个字菜单的父级都可以正常显示，只有父级下是一个子菜单的父级菜单不显示。所以断定是因为只有一个子菜单，父级隐藏不显示属性引起的。在处理从后台接口拿到的菜单数据时设置alwaysShow: true...
原创
4328阅读
0评论
4点赞
发布博客于 2 年前

pre-commit hook failed报错解决

错误呈现在git提交代码到远程库时，有时候会报pre-commit hook failed错误，导致提交失败。错误截图如下：解决在项目所在目录下的.git文件夹下（如果找不到，可能是隐藏了，可以通过设置文件夹属性找出来）的hooks文件下有一个pre-commit文件，删掉此文件，再次提交即可成功。...
原创
759阅读
0评论
0点赞
发布博客于 2 年前

前端开发资源收藏

VSCode拓展推荐https://github.com/varHarrie/varharrie.github.io/issues/10vue-element-adminvue-element-admin是一个后台前端解决方案，它基于 vue 和 element-ui实现。它使用了最新的前端技术栈，内置了 i18 国际化解决方案，动态路由，权限验证，提炼了典型的业务模型，提供了丰富的...
原创
128阅读
0评论
0点赞
发布博客于 2 年前

vue报错：Uncaught (in promise) TypeError: (0 , _auditorMange.default) is not a function解决

到了下班时间，脑袋越来越晕，犯得错误也越来越多。调用后台接口时，就发现了如下错误，虽然没有耽误太多时间来解决，还是很有必要记录下来。报错如下:这里vue文件中定位的行数也是不准确的。原因分析：脑袋不思考，ES6掌握不扎实。导致API引入时 没有带花括号引起该错误。错误截图如下：接口定义：解决：按如下形式调用，不再报此错。...
原创
14704阅读
2评论
2点赞
发布博客于 2 年前

后台管理项目blob导出文件乱码解决方案

项目中需要导出文件，使用blob对象方法导出文件成功，但是打开文件就是乱码，有时甚至打不开。导出代码如下：handleExport() { //exportFlie是调用接口的方法，如下： //export function exportFlie(data) { //return request({ //url: '/xxxx/v2/xxxxx', //method...
原创
2458阅读
1评论
0点赞
发布博客于 2 年前

vue实现富文本编辑器(附图)

工作项目中涉及到富文本编辑器的使用，这里我使用Vue-Quill-Editor插件实现了一个基本具备设计图上功能的编辑器。下载Vue-Quill-Editornpm install vue-quill-editor --save 安装 vue-quill-editor 插件。注册使用插件在main.js中写如下代码：import VueQuillEditor from 'vue-...
原创
711阅读
2评论
0点赞
发布博客于 2 年前

element:常见用法总结（前后台常见问题与自定义表单验证）

后台给的状态是使用12345状态码表示的，前端要把它转成对应的状态文字。这里使用element-ui的table为例，代码如下：<el-table-column label="审核结果" align="center"> <template slot-scope="scope"> <span v-if="scope.row.authStatus === ...
原创
925阅读
0评论
0点赞
发布博客于 2 年前

sublime和vscode常用高效插件及文件模板新建与git国内下载地址

1.常用插件列举sublime编辑器常用插件如下：Emmet功能：编码快捷键，前端必备。JSFormat功能：JavaScript的代码格式化插件。LESS功能：LESS高亮插件。Less2CSS功能：编译Less。简介：监测到文件改动时，编译保存为.css文件。Git功能：Git管理。Markdown Preview功能：md格式文件预览。...
原创
265阅读
0评论
0点赞
发布博客于 2 年前

小程序云开发获取不到其他用户数据库记录的解决方法

小程序云开发影评功能只能看到自己的评论，他人的看不到。只需要修改数据库权限即可，如下：1.获取comment集合记录const db = wx.cloud.database()onShow: function () { db.collection('comment') .get().then(res => { console.log(res.data)...
原创
656阅读
2评论
2点赞
发布博客于 2 年前

一次webpack 的externals配置带来的优化体验

externals官方解释：防止将某些 import 的包(package)打包到 bundle 中，而是在运行时(runtime)再去从外部获取这些扩展依赖(external dependencies)。1.优化前使用echarts的一个项目，使用npm run build 打包以后还有6m左右的大小，如下：这里打包以后文件明显过大，可能会造成用户体验差。2.优化考虑到可能是因为引...
原创
2335阅读
0评论
0点赞
发布博客于 2 年前
面试中Promise相关问题
发布Blink于 2 年前

面试中Promise相关问题

结合bilibili和小米和阿里的面试题中出现的与Promise对象相关的问题自己试着做了一些回答，涉及的有以下几个问题。详述Promise的异步机制？Promise有几种状态？Promise如何满足多个异步进程的同步顺序？Promise.all的用法如何让Promise.all在抛出异常后依然有效？Promise.all与Promise.race的区别？应用场景？1.Promi...
原创
325阅读
0评论
1点赞
发布博客于 2 年前

一夜不睡会有怎样的结果啊，睡不着

 
发布Blink于 2 年前

函数节流与防抖实现

问题引出：什么是函数节流？什么是函数防抖？1. 函数节流函数节流：一个函数执行一次后，只有大于设定的时间周期才会执行第二次。场景：有个需要频繁触发的函数，出于性能优化角度，在规定的时间内，只让函数触发的第一次生效，后面的不生效。代码实现： /* 节流函数：throttle fn: 要被节流的函数 delay：规定的时间 */ function throttle(fn,d...
原创
2158阅读
2评论
4点赞
发布博客于 2 年前
封装函数进行字符串驼峰命名的转换
发布Blink于 2 年前

我们一起写算法08

已知有一个字符串foo='get-element-by-id'，请写一个function将其转化为驼峰表示法getElementById。思路:首先根据’-'分割字符串为单个单词。从第二个单词开始将首字母转为大写。再将单词拼接用到的js方法：toUpperCase：字母转为大写。substr：在字符串中抽取从 start 下标开始的指定数目的字符。charAt() ...
原创
257阅读
0评论
1点赞
发布博客于 2 年前
localStorage、sessionStorage 、cookie
发布Blink于 2 年前

localStorage、sessionStorage 、cookie

问题1：请描述cookies、sessionStorage和localStorage的区别？问题2：有用过本地存储吗？有什么限制？有没有考虑过超出了限制怎么办？1.localStorage本地存储和sessionStorage会话存储localStorage 和 sessionStorage 属性允许在浏览器中存储 key/value 对的数据。只读的localStorage属性 可以...
原创
232阅读
0评论
0点赞
发布博客于 2 年前

想换工作，不知道是否能找到一份心仪的工作，也算对得起一直在掉的头发了→_→

发布Blink于 2 年前

防止页面跳转的几种方法

1.<a href="javascript:;" >先学习</a><a href="javascript:;" >点我试试</a>：执行一段空白的javascript语句，返回空或者false值，从而防止链接跳转。跟当前a标签无关，这段代码始终都会执行。html代码：<a href="javascript:;" onclick="java...
原创
6271阅读
1评论
1点赞
发布博客于 2 年前

前端面试必备总结：CSS盒模型与BFC

盒模型是css的基石，由什么是css盒模型一个问题引出下面一系列的问题，深度逐渐递增。1.基本概念：标准模型+IE模型2.标准模型和IE模型的区别3.css如何设置这两种模型4.JS如何设置获取盒模型对应的宽和高5.根据盒模型解释边距重叠6.BFC（边距重叠解决方案）1.什么是css盒模型css盒模型包括标准模型和IE模型。默认是标准模型所有的HTML元素都可以看做盒子，css盒...
原创
342阅读
0评论
0点赞
发布博客于 2 年前
面试：页面布局5种解决方案
发布Blink于 2 年前

前端面试必备总结：页面布局5种解决方案

在一面或者二面中，页面布局是经常问到的点，昨天在慕课网听了老师讲的课，今天自己敲下代码整理下。主要解答三栏布局下面两题目，两栏布局与三栏布局相似。1.高度已知，左右宽度固定，使中间自适应。2.上下高度固定，使中间自适应1.左右宽度固定，中间自适应float解决方案css实现：html *{ padding: 0px; margin: 0px;}.box div{ min-...
原创
1101阅读
0评论
2点赞
发布博客于 2 年前
我们一起写算法07
发布Blink于 2 年前

我们一起写算法07

快速排序算法与三路快排快速排序（Quicksort）是对冒泡排序的一种改进。它的基本思想是：通过一趟排序将要排序的数据分割成独立的两部分，其中一部分的所有数据都比另外一部分的所有数据都要小，然后再按此方法对这两部分数据分别进行快速排序，整个排序过程可以递归进行，以此达到整个数据变成有序序列。1.普通快排快速排序不是一种稳定的排序算法，也就是说，多个相同的值的相对位置也许会在算法结束时产生变...
原创
191阅读
0评论
1点赞
发布博客于 2 年前
我们一起写算法02
发布Blink于 2 年前

我们一起写算法06

1.整数反转此题目是LeetCode第7题，使用两种javascript方法求解。题目描述/*给出一个 32 位的有符号整数，你需要将这个整数中每位上的数字进行反转。示例 1:输入: 123输出: 321示例 2:输入: -123输出: -321示例 3:输入: 120输出: 21注意:假设我们的环境只能存储得下 32 位的有符号整数，则其数值范围为 [−...
原创
240阅读
0评论
0点赞
发布博客于 2 年前
我们一起写算法01
发布Blink于 2 年前

我们一起写算法05

平时有空的时候解一篇算法题目，（LeetCode提供了一千多道算法题目）不仅可以提高逻辑思维能力，也可以巩固JavaScript基础知识。统一到算法题目可以使用多种语言求解，解法思路是相同的，我们是学习前端的，所以这里只写javascript的解法。1.两数之和题目描述/*给定一个整数数组 nums 和一个目标值 target，请你在该数组中找出和为目标值的那两个整数，并返回他们的数...
原创
287阅读
0评论
1点赞
发布博客于 2 年前
从零到整开发JJ智能生鲜平台（小程序版）
发布Blink于 2 年前

从零到整开发JJ智能生鲜平台（小程序版）

现在电商做的风生水起，各家门主都想得其红利，分一杯肥羹。无论是小程序还是移动端、web端前端页面开发都大致相同。不能只会写代码，不会梳理描述。我把JJ智能生鲜平台（以下简称JJ平台）分各个页面和模块编写，然后逐一进行分析，实现页面间交互，比如点击首页轮播图跳转到对应商品详情页等，最后附上源码。本文主要涵盖一下内容：Easy Mock平台首页分类详情页购物车我的功能开发（跳转、网络请...
原创
524阅读
5评论
4点赞
发布博客于 2 年前

Easy Mock全解及使用

一、什么是Easy MockEasy Mock 是一个可视化的能快速生成模拟数据的持久化服务。在实际开发中常见的Mock方式一般是将模拟数据直接写在代码里，利用JavaScript拦截请求或者利用 Charles、Fiddler等代理工具拦截请求，这样的开发效率比较低，并且产生的数据是写死的，不能去按照一定的规则去变化，并且浪费了非常多的时间，因此有了这个产品的出现，我们可以容易的访问数据，而且...
转载
16666阅读
3评论
7点赞
发布博客于 2 年前
JavaScript高频易错题目三道(4)
发布Blink于 2 年前

为什么越熬越精神呢？昨晚上看《情深深雨蒙蒙》到一点半，午休还是不困。

发布Blink于 2 年前

JavaScript高频易错题目三道(4)

题目1getName七问七答，下面代码，输出结果分别是？function Foo(){ getName=function(){ console.log(1); } return this}Foo.getName=function(){ console.log(2);}Foo.prototype.getName = function() { // body... co...
原创
260阅读
0评论
0点赞
发布博客于 2 年前

JavaScript高频易错题目三道(3)

题目1如下代码输出的结果是什么？console.log(1+"2"+"2");console.log(1+ +"2"+"2");console.log("A"-"B"+"2");console.log("A"-"B"+2);console.log(1+ -"1"+"2");console.log(+1 +"1"+"2");A 122 122 NaN NaN 112 112B 1...
原创
263阅读
4评论
1点赞
发布博客于 2 年前

发现裙子穿着勒的慌，太久没运动了，做了十个俯卧撑，三分钟平板撑，胳膊酸的啊😄，打字抖得厉害

发布Blink于 2 年前

JavaScript高频易错题目三道(2)

题目1现有如下HTML结构：<ul> <li>click me</li> <li>click me</li> <li>click me</li> <li>click me</li></ul>运行如下代码：var elements = document.getE...
原创
253阅读
0评论
0点赞
发布博客于 2 年前

努力的工作，努力的写代码，就是为了有好的生活，我的愿望终于实现了，端午乌镇游。

发布Blink于 2 年前

JavaScript高频易错题目三道(1)

前言以前刷过一遍html、css、JavaScript题目，错误率也很大，特别是JavaScript，如果不理解其考察的知识点精髓所在，遇到的错题再次遇到还会错，所以在这里将曾经做错的题目记录下来，并附上解析和答案，希望自己可以掌握这些题目考察的知识。题目1有如下代码，请问执行后输出的值是？var name = "World"(function(){ var name; if (ty...
原创
251阅读
0评论
0点赞
发布博客于 2 年前

小程序：画布canvas和媒体类组件实例总结

小程序的绘图组件与html5里的canvas是类似的，而媒体类组件常用的有音频audio、相机camera、视频video等。下面就用例子说明每一个具体组件的用法和常用属性用法解析。1.画布canvascanvas可以用来绘制图形和动画，图形和动画的具体实现要借助API wx.createCanvasContext， wx.createCanvasContext返回一个canvas对象，它有很...
原创
640阅读
0评论
1点赞
发布博客于 2 年前

不知道为什么就是觉得尤大大很帅。表情很到位。

发布Blink于 2 年前

麦子收完，玉米又种上了，阿宝晒的小脸通红。

发布Blink于 2 年前

小程序：导航navigation与地图map组件总结

导航与地图组件的应用场景：在小程序需要由当前页面跳转到指定的页面时，就可以使用导航navigation组件，只需要设置指定页面的url地址即可。当需要实现定位、查找位置等一些LBS信息时，像滴滴打车这样的应用，就可以用地图map组件。1.导航navigationnavigation：页面的链接。它有很多的属性，最最常用的就是url，表示当前小程序内的跳转链接。navigation组件用法也...
原创
867阅读
0评论
1点赞
发布博客于 2 年前

小程序：基础内容和表单组件总结

前言经过这么久的学习，可以看出来小程序中组件的使用方法就跟html的标签一样，标签有起始<tagname>和闭合</tagname>，可以拿来直接使用，然后属性直接在<tagname>中调用，例如，使用button组件的type属性，可以这样用：<button type='primary'></button>1.基础内容组件基础...
原创
967阅读
0评论
1点赞
发布博客于 2 年前

这个逻辑能力怎么样，遇见高手了。

发布Blink于 2 年前

期待已久，终于有开通的希望了，以后从郑州回家就不用坐3-4小时大巴了，这么些年从郑州回家真的太波折了。

发布Blink于 2 年前

WEB响应式布局之BootStarp

1.Bootstrap：概念： 一个前端开发的框架，Bootstrap，来自 Twitter，是目前很受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JavaScript 的，它简洁灵活，使得 Web 开发更加快捷。框架:一个半成品软件，开发人员可以在框架基础上，在进行开发，简化编码。好处：定义了很多的css样式和js插件。我们开发人员直接可以使用这些样式和插件得到...
转载
214阅读
0评论
0点赞
发布博客于 2 年前

小程序：滚动scroll-view和轮播图swiper

1.scroll-viewScrollView是可滚动的视图区域，直接使用ScrollView组件即可实现滚动效果。如下：在wxml中使用scroll-view组件，组件里面用几个view视图显示。也可以放置文字或图片等内容。<!-- demo.wxml --><scroll-view> <view id="green" class='scroll-view...
原创
2078阅读
2评论
0点赞
发布博客于 2 年前

今天六一啊，你忘了吗，来公司加班学习，收到外卖小哥的电话，感谢外卖小哥，特别感谢点餐小哥。节日快乐。

发布Blink于 2 年前

看到上面有个人了吗？

发布Blink于 2 年前

overflow:hidden单行和多行文本溢出隐藏需要注意

1.单行文本溢出单行文本隐藏样式使溢出部分使用省略号显示，需要下面3个属性同时设置：overflow: hidden;white-space: nowrap;text-overflow: ellipsis;完整代码如下：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"...
原创
954阅读
0评论
1点赞
发布博客于 2 年前

小程序：模板与引用

准备工作：新建一个quickstart项目，然后再pages目录下自己新建一个页面，例如t文件夹名为test，再在其下分别新建test.wxml、test.js、test.wxss文件。最后在app.json全局配置文件中配置test页面路径，项目结构如下：然后再新建模板目录，在其下面新建header.wxml组件，相当于vue的组件，单独写一个文件，在其他页面方便直接拿来使用。如下：1...
原创
1657阅读
0评论
0点赞
发布博客于 2 年前

小程序：组件使用、数据绑定、条件渲染、列表渲染

准备工作：新建一个quickstart项目，然后再pages目录下自己新建一个页面，例如t文件夹名为test，再在其下分别新建test.wxml、test.js、test.wxss文件。最后在app.json全局配置文件中配置test页面路径，项目结构如下：1.组件的基本使用小程序开发文档中组件部分有很多组件介绍，包含视图容器类组件，基础内容类组件、表单组件、导航组件、媒体组件、地图组件和...
原创
1320阅读
0评论
0点赞
发布博客于 2 年前

为所有爱执着的痛， 为所有恨执着的伤， 我已分不清爱和恨。。 最美的新娘。

发布Blink于 2 年前

小程序制作宋词欣赏海报

海报就是单纯的一张页面，可以用来练习WXML和WXSS。进一步入门微信小程序。海报效果如下：在经过小程序的预热一和预热二后，新建一个小程序项目已经不成问题了。海报的制作过程：1.页面结构实现页面结构主要是通过WXML模板组成。使用小程序官方封装好的view标签和image标签。view标签类似于div，可以显示文字，也单独占据一行。封装的标签也可以使用css的class选择器。代码如下：...
原创
307阅读
0评论
0点赞
发布博客于 2 年前

微信小程序预热(二)：小程序五脏组成介绍

九层之台起于垒土，想要完成一个小程序项目，当然要明白小程序是有哪几部分构成的，及每一部分各自所起的作用、这几部分之间的关联。弄清楚的了这些问题才能明白小程序的实现原理。上节预热一种使用微信开发者工具新建了一个helloworld的小程序，如果你的环境还没搭建，也不知道如何建立第一个小程序项目，请参考：微信小程序预热一1.小程序代码构成这里创建了建了一个 QuickStart 项目，界面如下：...
原创
326阅读
0评论
1点赞
发布博客于 2 年前

华为，加油！

发布Blink于 2 年前

微信小程序预热(一)：如何开启第一个小程序

正所谓万事开头难，走出第一步，后面也就顺其自然走上来了，当我要开始学习小程序的时候，看了两天的小程序官方开发文档，但是仍然不知道怎么创建我自己的一个小程序。所以我决定在这个晚上结束这种畏惧的状态，打开笔记本，开始第一步预热操作。1.小程序说明小程序有一套健全的官方开发文档，中文模式，基本都能看的懂。文档中对小程序的介绍如下：小程序是一种全新的连接用户与服务的方式，它可以在微信内被便捷地获取...
原创
347阅读
0评论
1点赞
发布博客于 2 年前

收麦子了，家里的麦子。

发布Blink于 2 年前

git提交代码到GitHub常见问题解决

git提交代码到GitHub时，由于多人同时对工程项目进行修改，可能会引起冲突，命令行会报一些错误。这里将我遇到的问题及解决方法记录下来。问题1：error：failed to push some refs to问题描述：命令行报 “error：failed to push some refs to …” 错误？报错截图如下：解决方法1出现错误的主要原因是github中的README...
原创
625阅读
0评论
0点赞
发布博客于 2 年前
js实现图片懒加载原理
发布Blink于 2 年前

js实现图片懒加载原理

有时候一个网页会包含很多的图片，例如淘宝京东这些购物网站，商品图片多只之又多，页面图片多，加载的图片就多。服务器压力就会很大。不仅影响渲染速度还会浪费带宽。比如一个1M大小的图片，并发情况下，达到1000并发，即同时有1000个人访问，就会产生1个G的带宽。为了解决以上问题，提高用户体验，就出现了懒加载方式来减轻服务器的压力，优先加载可视区域的内容，其他部分等进入了可视区域再加载，从而提高性能。...
原创
60959阅读
22评论
116点赞
发布博客于 2 年前
vue商城购物车功能开发(含动图)
发布Blink于 2 年前

vue商城购物车功能开发(含动图)

购物车不管实在众多的电商网站还是手机APP中都很常见，它的实现逻辑也是相对复杂的。购物车作为组件开发，在其他应用或者页面也可以拿来直接使用。包含如下功能：购物车模板商品数量加减商品总价结算商品删除商品全选反选实现效果如下：1.购物车页面模板实现引入bootstrap购物车的页面不再使用html一点点的写，这里使用bootstrap，比较节省时间。所以要引入bootstr...
原创
3245阅读
7评论
13点赞
发布博客于 2 年前

抬头看看今天的天空，真美。

发布Blink于 2 年前

你会制作点赞吗？(含动图)

像常见的QQ空间点赞、微信点赞、各种论坛和微博都会有点赞的功能，其实现也是比较容易。用到的css处理知识如下：jquary的$(‘tag’).append()setInterval()定时器css样式透明度opacity定位position字体大小、位置实现代码实现代码如下：<!DOCTYPE html><html lang="en"><he...
原创
613阅读
0评论
6点赞
发布博客于 2 年前
商城项目商品列表页的渲染实现
发布Blink于 2 年前

商城项目商品列表页的渲染实现(含动图)

有了v-for循环，渲染商品列表简直不要太方便了，以前写一个商品列表页要一天，现在只需要几分钟，除了模拟数据会耗一点时间。这里可以了解下Mock模拟数据，它可使前端工程师独立于后端进行开发，在前端可以先行自己测试，之后再与后端对接联调，可以节省不少的时间。所谓孰能生巧，vue构建项目联系的多了以后也可随意的封装组件，抽离组件。用起来得心应手。实现效果动图如下：商品列表页的实现步骤如下：1...
原创
1426阅读
0评论
1点赞
发布博客于 2 年前

南方如此多雨。

发布Blink于 2 年前

git常用命令

公司用的还是SVN版本库，但是自己往GitHub中提交项目还是会用到git命令的，这些命令使用一次两次也记不住，必须要经常使用才能记得住，所以这里记录下来，用到的时候有地方查。如下：git init                  &n...
原创
236阅读
0评论
3点赞
发布博客于 2 年前

商城项目登录功能实现(动图)

导语去年上传了重构小米官网商城的首页，但是没有登录注册功能。不论是js原生方法实现，还是jq和vue等框架实现，个人认为是大同小异，思路是一样的。在使用vue构建数字商城的项目中使用vue也实现了登录功能，点击登录跳转到登录页面是使用vue-router实现的，登录页面事使用html、css实现，登录验证功能使用表单、v-model和正则表达式实现。先看实现的功能如下：演示的有些快，可能...
原创
1927阅读
0评论
2点赞
发布博客于 2 年前

我们一起写算法04

1.算法使用范围：二分法查找使用数据量较大的时候，但是条件是数据需要先排好顺序。2.算法描述：确定该区间的中间位置，每次查找中间的值，数组被分为左边和右边两部分。将查找的值与中间值比较。（1）如果相等，就返回对应的下标。（2）如果查找的值大于中间的值，则将右边部分数组继续分成左右两部分，确定中间位置的值，继续步骤2。（3）如果小于，则在数组左半边继续二分查找。重复上述步...
原创
366阅读
0评论
2点赞
发布博客于 2 年前

我们一起写算法03

前端面试中关于数组问题层出不穷，就我见到三个问题做出以下分析。问题如下：问题1：如何实现数组的去重问题2：从下面数组中找出不重复的元素算法问题3：从下面数组中找出重复的元素算法1.实现数组去重的方法实现数组去重有多重方法：方法1：计数排序，遍历每个元素为其设置布尔值。只针对正整数。var a = [5,8,3,4,3,2, 8];var onlyElement...
原创
552阅读
2评论
2点赞
发布博客于 2 年前