webpack4构建前端项目

在使用webpack 4.x版本构建前端项目的时候,遇到了一些坑点,这里做一下记录,详细内容见注释。 1、项目目录:     2、基本配置内容 webpack.base.config.js 'use strict'; const path = require('path'); c...

2019-01-02 23:06:49

阅读数 868

评论数 0

前端常用正则校验

前端校验验证器: export const Validator = { isEmil: /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/, // 校验邮箱 isPhoneNumber: /^1[34567...

2018-12-29 10:27:54

阅读数 3145

评论数 0

react实现图片预览组件

功能主要包括:下载图片、等比缩放、旋转、全屏拖拽 用法: import ImgPreview from '@/components/ImgPreview' {/* 图片预览组件 */} <ImgPreview visible={previewVisible} ...

2018-12-27 22:17:40

阅读数 260

评论数 0

iOS唤起键盘页面被顶上去且无法自动回退带来的问题及解决方案

一、问题描述: 问题1:iOS唤起软键盘,将页面顶出屏外,且无法自动回退到正常位置 详细描述:在开发H5页面时,会遇到这样的问题,在iPhone访问有提交按钮fixed在底部页面,且页面中有input框等可录入信息的元素时,点击input框唤起键盘,输入信息,这时候页面会被顶出屏外,且在点击键...

2019-01-18 22:04:18

阅读数 14

评论数 0

npm常用命令及package-lock.json的作用

介绍一些npm常用的命令,以及其对应的简写,在项目中安装一些包的时候,推荐在命令行中加上--save,以保证添加的包依赖会被保存到package.json文件中。 注意: 1、如果你是新版本npm(5.x以上),不加--save会默认将依赖加到package.json文件的dependenci...

2019-01-17 22:59:23

阅读数 22

评论数 0

通过CSS实现 文字渐变色 的两种方式

版权声明:本文为博主原创文章,欢迎转载,转载请注明出处。 https://blog.csdn.net/FE_dev/article/details/78450844 &am...

2019-01-17 17:49:09

阅读数 15

评论数 0

引用类型深拷贝

// 递归实现引用类型数据的拷贝 function deepCopy(oldObj, newObj){ var newObj = newObj || {} for(let i in oldObj){ if(typeof oldObj[i] === 'object'){ if (o...

2019-01-17 12:53:13

阅读数 6

评论数 0

node-模块系统exports与module.exports的区别

node笔记——exports与module.exports的区别 注意:node每个模块中,exports和module.exports指向同一对象,但每个模块默认返回module.exports。 使用场景: 1、将多个需要导出成员挂载到exports对象中导出,这样在使用导出的成员时,...

2019-01-16 23:00:18

阅读数 10

评论数 0

伪造点击事件下载当前网页

通过点击按钮实现当前网页的下载: example: downloadAsHtml('test') const STYLE = 'body{...}' // css样式,保证下载后得到的本地css文件样式不丢失 // ... /** * 将页面已html格式文件下载至本地 * para...

2019-01-16 13:02:30

阅读数 20

评论数 0

input光标总是在内容最末端

前端在优化用户体验的时候,经常会遇到这样的需求: 当input框有值的时候,用户再去编辑这个input,无论用户点input的什么位置,总是将光标置于input已有内容的最末端。 下例是基于vue框架的写法: <input type="text&am...

2019-01-08 13:11:28

阅读数 39

评论数 0

XMLHttpRequest.withCredentials 解决跨域请求头无Cookie的问题

XMLHttpRequest.withCredentials  属性是一个Boolean类型,它指示了是否该使用类似cookies,authorization headers(头部授权)或者TLS客户端证书这一类资格证书来创建一个跨站点访问控制(cross-site Access-Control)...

2019-01-07 19:01:24

阅读数 51

评论数 0

基于es6 import()实现本地数据mock

import()动态加载相关资料:https://blog.csdn.net/Zckguiying/article/details/85864233 需求描述:前端项目中必定要有本地数据mock的模块,实现前后端分离,解决开发时因前后端接口的依赖而导致开发效率低下的问题。 实现方案:这里主要使...

2019-01-05 20:59:18

阅读数 44

评论数 0

es6 import()函数用法

import()函数 简介 前面介绍过,import命令会被 JavaScript 引擎静态分析,先于模块内的其他模块执行(叫做”连接“更合适)。所以,下面的代码会报错。 // 报错if (x === 2) { import MyModual from './myModual';} 上...

2019-01-05 18:17:46

阅读数 31

评论数 0

react 在componentWillUnmount中卸载异步操作设置状态

react中经常会遇到这样的wraning: Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in yo...

2019-01-02 23:30:56

阅读数 125

评论数 0

使用less注意的地方

1、制作模糊背景效果(毛玻璃效果)       filter: blur('10px');  // 注意:css正常写法filter: blur(10px);  此时10px不需要加引号 2、css计算属性       width: calc(~'100% - 260px'); // 注意:...

2019-01-01 21:03:29

阅读数 21

评论数 0

js日期格式化

测试:   /** * @param date 标准日期格式,example:new Date() * @param fmt 格式化数据类型,example:'yyyy-MM-dd hh:mm:ss' || 'yyyy年MM月dd日' * @returns {*} */ export...

2019-01-01 20:01:47

阅读数 22

评论数 0

前端解析当前url中的参数

前端项目中,必不可少的需要用到解析当前url,从而获取其中的参数。 测试: 注意:这里获取的参数值都为String类型 /** * url参数解析 * @example String "https://mp.csdn.net?id=123456&a...

2019-01-01 19:43:35

阅读数 20

评论数 0

移动端开发调试工具——eruda

移动端开发调试是一个比较麻烦的事情,本篇文章将介绍使用eruda来完成移动端开发调试。 一、直接使用: 在前端项目的index.html中直接通过js写入eruda工具 <!DOCTYPE html> <html&a...

2018-12-27 23:50:50

阅读数 25

评论数 0

Promise实现接口超时限制

主要思想:通过Promise.race()实现接口超时限制    // 定义上传文件接口函数 export const uploadFile= (params) => { let uri = serverSrc + '/api/xxx/xxx' // 设置请求地址 ...

2018-12-27 23:22:17

阅读数 22

评论数 0

基于canvas实现图片压缩

用法: compressImg(target.files[0], 2).then(base64 => { console.log(base64) // 在这里实现压缩后的上传操作 // ... }).catch(err => { // 压缩...

2018-12-27 22:53:56

阅读数 36

评论数 0

提示
确定要删除当前文章?
取消 删除
关闭
关闭