- 博客(42)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 前端工程自动化
前端工程自动化链接：https://github.com/SunshowerC/blog/issues/1css-modules：http://www.ruanyifeng.com/blog/2016/06/css_modules.htmleslint 代码检查
2020-02-27 20:02:46
286
原创 vue面试知识点
看到几个知识点整理全面的文章，安排上：https://www.jianshu.com/p/2ed9f54a3ff2https://www.jianshu.com/p/8a06d9507fafhttps://blog.csdn.net/tangxiujiang/article/details/88717923
2019-12-01 21:06:39
297
原创 _.isEmpty是什么写法？
跟jquery.js一样，使用$import $ from "jquery";underscore.js，使用_import _ from "underscore";underscore库:http://www.css88.com/doc/underscore/
2019-11-28 16:53:26
1101
原创 beforeRouteEnter、beforeRouteUpdate、beforeRouteLeave的使用
参考资料：vue-router1、beforeRouteEnter的使用场景：组件复用；路由跳转beforeRouteEnter (to, from, next) { // 在渲染该组件的对应路由被 confirm 前调用 // 不！能！获取组件实例 `this` // 因为当守卫执行前，组件实例还没被创建 console.log(to) cons...
2019-11-28 16:45:40
1626
原创 axure修改元件的class名
axure可以自定义元件的class名：1、先选中要自定义的元件，再点击右侧样式，点击管理元件样式：2、点击添加，输入自定义的class名，点击确定3、然后重新选择元件样式就可以了：4、在浏览器里可以查看到新添加名为header的class...
2019-11-23 15:52:29
560
原创 axure引用外部css文件
对于前端开发者来说，用axure设计页面，可以用一行css实现想要的效果：1、载入页面添加用例：2、链接到外部地址如下：javascript:$("<link>").attr({ rel: "stylesheet",type: "text/css",href: "https://cdn.bootcss.com/font-awesome/4.7.0/css/...
2019-11-22 09:27:16
2432
原创 Vscode使用操作
1、修改背景颜色快捷键：ctrl+k ctel+t2、修改背景颜色：文件----首选项-----颜色主题3、安装svn：4、安装中文简体：chinese5、修改字体大小：文件---首选项----设置：输入font-size7、插件：Auto Close Tag（自动闭合HTML/XML标签）8、插件：Auto Rename Tag（自动完成另一侧标签...
2019-10-16 18:01:23
2433
原创 下载base64码
功能描述：服务将一串base64码传到前端，用户点击下载就可以将该base64码解码。实现方法：1、将base64码转成二进制流，2、下载附全部代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</...
2019-09-27 10:00:47
25672
原创 js实现将网页下载为pdf
前端有时会有实现将局部网页转成pdf并且下载到本地的需求，以下实现过程仅限简单的操作：1、引入jspdf相关的插件<script src="https://cdn.jsdelivr.net/bluebird/latest/bluebird.js"></script><script src="https://cdnjs.cloudflare.com/ajax...
2019-09-26 15:31:04
4749
1
原创 fixed实现div居中
前端开发中，有时候既要实现一个div fixed固定定位，又要实现该div居中且div里的内容居中，实现方法如下：在div的css为：.fixed-c { height: 80px; width: 90%; position: fixed; margin: auto; ...
2019-09-26 11:59:39
4292
原创 子级div设置margin属性影响父级位置
前端开发中，有时候会遇到设置子级div的margin属性后，导致整个父级div整体移动，有时候却是正常的，时而正常时而有异常。一、问题描述：1、css未设置margin属性时，效果图如下：没有margin设置2、css设置 margin-top:50px 属性时，预期效果图如下：预期效果图3、css设置 margin-top:50px 属性时，实际效果图如下：...
2019-09-24 17:46:38
1514
原创 日期控件在ios端不兼容问题
日期控件在Android端正常显示，但是在ios端确不兼容，如下图： ios端 Android端将日期转一下，如下操作即可：//date在苹果手机不兼容的bug，val...
2019-03-04 16:44:55
3402
原创 react实现在路径里给页面传参数
在项目中，尤其是多个项目混用时，项目a需要调用项目b的某个页面，并且要想项目b的页面传入值，可以用如下url的方式传值：http://localhost:8000/#/authentica?openid=1&b=2在项目b的页面中书写该方法，如下：//http://localhost:8000/#/authentica?openid=1&b=2。经过此方法后得到对...
2019-03-04 16:31:56
1583
原创 react封装自定义组件
在项目中，我在不同的页面会使用相同样式的代码，为了避免写多处重复的代码，也避免后期多处维护的弊端，我们可以将相同样式的代码自定义封装成组件，在不同的页面调用自定义组件即可。1、先封装自定义组件1）、新建CardList文件夹2）、在CardList文件夹里新建index.js文件，并在index.js文件里书写如下代码：//index.js暴露组件CardListimport ...
2019-03-04 09:51:18
17408
1
原创 修改原数组对象特定位置里的数据
原数组对象a如：//对象a[{ "num": "20181101", "name": "张三", "age": 12}, { "num": "20181102", "name": "李四", "age": 22}]操作：在数组对象a中找到num为20181102的对象，添加字段sex
2019-02-21 15:14:36
4777
原创 react跳转路由后位置在上个页面浏览的位置
react跳转路由后，展示的位置是上个页面浏览的位置。解决的思路是强制回到顶部//在父页面里加入该行代码即可componentWillUpdate(){ document.getElementById('root').scrollIntoView(true);//为ture返回顶部，false为底部}如果使用的是单独的页面，则需要在单独的所有页面里加入如下代码：//...
2019-02-21 11:02:02
3168
1
原创 修改react项目默认访问的端口号
问题：多个react项目同时启动时存在端口占用的问题，所以需要修改默认的端口号来解决该问题解决方法：在package.json文件中的start后面加入“set PORT=9000 && ”，如下：{"scripts": { "start": "set PORT=9000 && roadhog server",//加入set PORT=900...
2019-01-17 14:19:23
4508
原创 根据图片地址上传图片
该方法适用移动端，选择手机图片后得到图片地址，此时需要将该图片地址转换成图片文件然后上传该图片，之前是在cordova混合开发app时，上传图片遇到的问题，因此总结出来。该方法同样适用其他手机端只有图片地址但是要上传图片文件的问题。思路是：1、将图片地址转换成二进制流。2、上传文件到服务器上。实现方式如下：///图片地址转换成二进制流rLFSURL(imageURI,type,fi...
2018-11-28 11:50:54
2722
原创 正则表达式校验年龄
用正则表达式校验年龄吗，此处校验的规章是数字并且在1-120之间，代码如下：validateAge = (rule, value, callback) => { console.log("value年龄的值",value); let reg=/^(?:[1-9][0-9]?|1[01][0-9]|120)$/;//年龄是1-120之间有效 if(value ==...
2018-11-28 10:31:35
29068
1
原创 正则表达式校验姓名为汉字
在表单中输入姓名时，校验姓名必须为汉字的校验。校验规则如下：validateName = (rule, value, callback) => { let reg=/^[\u2E80-\u9FFF]+$/;//Unicode编码中的汉字范围 if (value && value.length > 0) { if(!reg.test(...
2018-11-28 10:26:58
27666
4
原创 正则表达式校验手机号
手机号的正则表达式校验规则如下：validatePhone = (rule, value, callback) => { var phone=value.replace(/\s/g, "");//去除空格 //校验手机号，号段主要有(不包括上网卡)：130~139、150~153，155~159，180~189、170~171、176~178。14号段为上网卡专属号段...
2018-11-28 10:13:39
37518
2
原创 js实现动态显示时间
实现动态显示时间的步骤：1、获取本地当前时间。2、使用定时器。3、离开时清除定时器。（本项目是以react为基础实现的，同理在普通的html中实现方式一样）1、获取本地当前时间方法写在一个名叫CommonMethod.js的文件里，代码如下：import React from 'react';//type为1时输出20181126103245，否则输出2018年10月26日|星期一|...
2018-11-26 10:37:54
3821
3
原创 js将阿拉伯数字转换成汉字大写
直接贴代码，如下：//阿拉伯数字转换成大写汉字function numberParseChina(money){//汉字的数字 var cnNums = new Array('零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖'); //基本单位 var cnIntRadice = new Array('', '拾', '佰', '仟...
2018-11-26 10:14:34
8312
原创 正则表达，校验身份证号
检验身份证号是否输入正确，代码如下：//react项目的校验//校验方法const validateCardid = (rule, value, callback) => { var value = value.replace(/\s/g, "");//去除空格 var a_idCard = value.split("");//得到数组 if(value...
2018-11-23 17:35:55
1066
原创 正则表达式至少包含大写字母、小写字母、数字、特殊符号四种中的任三种
用一条正则表达式表示会增强书写的难度，此处使用条件判断的方法来实现四种中选择三种的方式来增强密码的难度，代码如下：//校验方法function passwordValidate（str）{ var rC = { lW:'[a-z]',//小写字母 uW:'[A-Z]',//大写字母 nW:'[0-9]',//汉字 sW...
2018-11-23 14:47:57
18448
1
原创 js给对象添加变量属性
1、js创建一个对象或者在原有对象上添加一个已知属性，并给这个属性赋值，写法如下：let obj = {'a1':'a1'};obj['a2'] = 'a2';console.log(obj);//输出{'a1':'a1','a2':'a2'}; 2、添加一个变量属性，并赋值变量，写法如下：function add(name,value){ let obj = {"a...
2018-11-21 15:44:49
54575
1
原创 nginx配置代理
现在主流前端框架，如vue、react开发完成后需要部署到服务器上供用户访问，然而打包之后生成的是静态页面，需要放到服务器上用nginx配置转发才可以访问，下面将介绍windows上nginx的配置（linux的配置一样，只是安装方式不同）：1、首先，下载nginx。2、下载之后进行解压缩，找到nginx/conf/nginx.conf文件3、配置nginx.conf如下：...
2018-11-09 11:10:50
485
原创 react页面兼容低版本浏览器
react开发时，使用es6语法方便快捷，但是有的浏览器对es6的兼容不太友好，引入“babel-polyfill”模块将解决这个问题。1、引入babel-polyfill模块，命令如下：npm install babel-polyfill --save2、在代码头部加载babel-polyfill，dva项目是在代码入口index.js文件的头部引入，其他项目找到对应的项目入口文件...
2018-11-09 10:35:10
9236
原创 git-flow使用
使用git flow1、创建develop分支git branch developgit push -u origin develop 2、创建自己的分支 git checkout -b test develop (test为创建的分支名)3、切换到test分支 git checkout test4、提交代码到test分支 ...
2017-12-08 17:15:36
357
原创 JavaScript的5种基本数据类型
JavaScript的5种基本数据类型：数字（number）、字符串（string）、布尔值（boolean）、null、undefined。1. typeof 运算符 typeof 运算符有一个参数，即要检查的变量或值。值有6种： (1)、"undefined"——未申明，或者变量的值即为undefined或者未初始化；
2017-06-05 15:33:32
1944
原创 CSS3伪类选择--目标伪类选择器
目标伪类选择器：E：target，选择匹配E的所有元素，并且匹配元素被相关URL指向。 目标伪类选择器是动态选择器，只有存在URL指向该匹配元素时，样式效果才会生效。例子：纯CSS3实现手风琴效果效果展示：初始页面：点击之后的页面：点击之后的页面：HTML代码：
2017-06-02 13:18:16
5685
原创 css3伪类选择器--动态伪类选择器
动态伪类并不存在于html中，只有当用户和网站交互的时候才会体现出来。动态伪类包含两种，一种是在链接中常看到的锚点伪类，一种是用户行为伪类。链接伪类选择器：E:link（未被访问过） 和 E:visited（已被访问过），用户行为伪类选择器：E:active（点击时）、E：hover（鼠标滑过时）、E：focus（元素获得焦点时）例子：美化按钮页面展示效果如下：
2017-06-02 11:13:31
3865
原创 css3选择器--层次选择器
层次选择器：通过html的dom元素间的层次关系获取元素，主要层次关系有 后代、父子、相邻兄弟和通用兄弟。1. 后代选择器： E F， 作用的是选择元素的后代元素。包括子元素、孙辈元素等。（常用）div div{ color：red；}2.子选择器： E > F，作用的是某元素的所有子元素，不能包括孙辈元素（常用）body > div{ color:red;
2017-06-01 16:29:37
9469
原创 css3选择器--基本选择器
基本选择器：是css中使用最频繁、最基础的。1.通配选择器：*，用来选择所有的元素。*{ padding：0; margin：0， }2.元素选择器：文档的元素包括html，body，p，div，ul，li等元素。p{ color:red;}body{ color:red;}3.ID选择器：具有唯一性，一个页面只能有一
2017-06-01 15:36:22
305
原创 css3选择器--分类（一）
CSS3的分类四大类，共十种。四大类：基本选择器、层次选择器、伪类选择器、伪元素、属性选择器。 其中伪类选择器包括六大类：动态伪类选择器、目标伪类选择器、语言伪类选择器、UI元素状态伪类选择器、结构伪类选择器、否定伪类选择器。
2017-06-01 15:35:10
494
原创 ant图标本地化
在做react开发时，打包之后可能会出现页面里的小图标不对的情况，修改做法如下：一、先下载 iconfont 字体的方法： 1.访问阿里巴巴适量图标库网址进行下载，http://www.iconfont.cn/ 2.选择“图标库---所有图标”： 3.可以直接搜索想要的图标，如下图： 二、把react项目打包，并把下载的矢量图字体放到iconfont文件夹下，目录如下：
2017-04-21 14:08:50
6280
原创 position:fixed失效
position：fixed可以使某个标签内容固定在页面的某个位置，不随浏览器滚动条而滚动，使用方法为：position:fixed;top:0;left:0;bottom:0;right:0;但父级元素的属性有transform时，position:fixed的作用就失效了。所以尽量使用position：absolute代替position：fixed的作用。具体怎么用稍后更
2017-03-30 21:47:52
1654
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人