- 博客(83)
- 收藏
- 关注
RSS订阅原创 typescript 学习
介绍TypeScript具有类型系统，且是JavaScript的超集。基础类型TypeScript 提供了和 js基本相同的数据类型，还提供了实用的枚举类型供我们使用。布尔类型let a: boolean = false;数字类型let n: number = 1;字符串类型let s: string = 'a';还可以使用模板字符串:let s: string = ...
2019-05-28 17:41:06
266
原创 node 环境配置
node 安装node 官网下载对应版本，一路 next安装完后，查看npm -v环境配置全局安装路径，缓存路径选择 node 安装地址，新建文件夹 nodejs ，nodejs 下创建 node_golbal、node_cache配置 npm 安装的全局模块所在的路径，以及缓存cache的路径。之所以要配置，是因为以后在执行类似：npm install express [-g]...
2019-04-28 20:05:18
565
原创 eslint 的使用
ESLint的用途审查代码是否符合编码规范和统一的代码风格审查代码是否存在语法错误官网https://eslint.org/居然找到了一个中文网站：http://eslint.cn/docs/user-guide/configuring#configuration-file-formats开始使用npm install eslint --save-dehttps://esl...
2019-04-08 17:29:53
383
原创 element-ui 组件使用中遇到的问题
el-progress percentage 超过100%官方文档中，el-progress 属性 percentage 可选值范围 0-100，超出会报错。https://github.com/ElemeFE/element/blob/dev/packages/progress/src/progress.vue但是，对于某些应用场景，可能并不适用。如目标设定，可能完成度超出目标设定，大于1...
2019-03-08 10:45:28
2388
转载 v-model指令在组件中怎么玩
好久没更了，近期太忙，不过收获很多，vue全家桶用的越来越顺手。总结的话，有时间再做，先占个坑 o(￣┰￣*)ゞ转自：https://juejin.im/post/598bf7a3f265da3e252a1d6a备注：文章内容和案例均基于Vue2（具体版本为Vue2.3.4）笔者最近在写组件的时候，遇到了 v-model 的使用问题，在 Vue 官方文档中，有两小端内容是关于 v-mo...
2019-01-05 13:11:53
484
原创 h5 标签
prepre 元素可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。<pre> 标签的一个常见应用就是用来表示计算机的源代码。当把其他标签（比如 <a> 标签）放到 <pre> 块中时，就像放在 HTML/XHTML 文档的其他部分中一样即可。...
2018-12-05 11:09:48
298
原创 vue踩坑指南
生命周期beforeCreate/created beforeMount/mountedbeforeUpdate/updated beforeDestroy/destroyedrender优先级render函数&amp;amp;amp;amp;amp;amp;amp;amp;amp;gt;template模板&amp;amp;amp;amp;amp;amp;amp;amp;amp;gt;outer HTML组件基本用法&amp;amp;amp;a
2018-11-01 16:40:02
305
转载 vue项目实现按需加载的3种方式：vue异步组件、es提案的import()、webpack的require.ensure()
1. vue异步组件技术vue-router配置路由，使用vue的异步组件技术，可以实现按需加载。但是，这种情况下一个组件生成一个js文件。举例如下： { path: '/promisedemo', name: 'PromiseDemo', component: resolve => requ...
2018-10-16 11:29:48
1335
转载 window.history的跳转实质－HTML5 history API 解析
在上一浏览器跳转行为的测试中，我们看到了通过不同的方法操作浏览器跳转时，它的刷新表现有所不同，在这一文章中，将看看，为何会产生这样的不同？其背后的实质是什么？浏览器的访问历史记录到底是如何运作的呢？1、简介window.history是用来保存用户在一个会话期间的网站访问记录，并提供相应的方法进行追溯。其对应的成员如下：方法：back()、forward()、go(num)、pushS...
2018-09-25 19:23:10
477
原创 less的使用
变量、嵌套、Mixin混合，示例：@ly_width:100px;@ly_height:200px;@ly_color:green;.border { .two { border:1px solid red; } }.one { width:@ly_width; height:@ly_height; background-co...
2018-09-25 14:54:06
265
转载 不受控制的 position:fixed
大家都知道，position:fixed 在日常的页面布局中非常常用，在许多布局中起到了关键的作用。它的作用是：position:fixed 的元素将相对于屏幕视口（viewport）的位置来指定其位置。并且元素的位置在屏幕滚动时不会改变。但是，在许多特定的场合，指定了 position:fixed 的元素却无法相对于屏幕视口进行定位。这是为何呢？失效的 position:fixe...
2018-09-19 19:11:43
1419
原创 前端模块规范 CommonJS、AMD、CMD、UMD、ES6
概括：分别介绍：es6 模块加载：比较一下默认输出和正常输出// 第一组export default function crc32() { // 输出 // ...}import crc32 from 'crc32'; // 输入// 第二组export function crc32() { // 输出 // ...};import {...
2018-09-19 14:10:40
542
原创 vue入门随笔
参考：详解vue生命周期：https://segmentfault.com/a/1190000011381906配置环境安装node，查看版本，8以上版本安装vue，npm install -g @vue/cli，如报错，npm cache clean --force，npm install npm -g 全局更新查看安装情况，vue --version安装vue扩展程序...
2018-09-12 15:07:42
249
转载 从输入URL到页面加载发生了什么？
转自：https://segmentfault.com/a/1190000006879700总体来说分为以下几个过程: DNS解析 TCP连接 发送HTTP请求 服务器处理请求并返回HTTP报文 浏览器解析渲染页面 连接结束 具体过程DNS解析DNS解析的过程就是寻找哪台机器上有你需要资源的过程。当你在浏览器中输入一个地址时，...
2018-09-05 22:19:42
463
转载 移动端Web页面适配方案
移动端Web页面，即常说的H5页面、手机页面、webview页面等。手机设备屏幕尺寸不一，做移动端的Web页面，需要考虑在安卓/IOS的各种尺寸设备上的兼容，这里总结的是针对移动端设备的页面，设计与前端实现怎样做能更好地适配不同屏幕宽度的移动设备。适配的目标引用一文章的描述：在不同尺寸的手机设备上，页面“相对性的达到合理的展示（自适应）”或者“保持统一效果的等比缩放（看起来差不多）...
2018-08-23 11:19:23
714
转载 react-router 按需加载
转自：https://segmentfault.com/a/1190000007141049注：本文使用的 react-router 版本为 2.8.1，第四版的处理还不太一样React Router 是一个非常出色的路由解决方案，同时也非常容易上手。但是当网站规模越来越大的时候，首先出现的问题是 Javascript 文件变得巨大，这导致首页渲染的时间让人难以忍受。实际上程序应当只...
2018-08-05 17:16:49
860
原创 一些优化（即时搜索之函数去抖）
第一步，确定用哪个动作。实现输入框实时搜索：input输入框的change事件，在输入框内容变化的时候不会触发change，要在input失去焦点的时候才会触发，当鼠标在其他地方点一下才会触发$('input[name=myInput]').change(function() { ... });//change,失焦才触发，nono用下面的方法会生效，input，注：IE下 用 on...
2018-08-03 16:46:25
1244
原创 高性能网站建设指南
当我们在浏览器地址栏输入网址 ，回车，回车这一瞬间到看到页面到底发生了什么呢？域名解析 –> 发起TCP的3次握手 –> 建立TCP连接后发起http请求 –> 服务器响应http请求，浏览器得到html代码 –> 浏览器解析html代码，并请求html代码中的资源（如js、css、图片等） –> 浏览器对页面进行渲染呈现给用户规则一：减少http请求雪碧...
2018-08-02 15:41:46
532
转载 PureComponent
PureComponent的作用及一些使用陷阱参考：https://www.jianshu.com/p/33cda0dc316a默认渲染行为的问题在React Component的生命周期中，有一个shouldComponentUpdate方法。这个方法默认返回值是true。这意味着就算没有改变组件的props或者state，也会导致组件的重绘。这就经常导致组件因为不相关...
2018-07-14 18:12:29
654
转载 npm install、npm init、npm update、npm uninstall和package.json
package.lock.json:作用：其实用一句话来概括很简单，就是锁定安装时的包的版本号，并且需要上传到git，以保证其他人在npm install时大家的依赖能保证一致在以前可能就是直接改package.json里面的版本，然后再npm install了，但是5版本后就不支持这样做了，因为版本已经锁定在package-lock.json里了，所以我们只能npm install xx...
2018-06-22 17:23:06
2790
1
原创 Echartjs系列文章之“实心”及“空心”圆饼图
“实心”圆饼图：<!DOCTYPE html><html style="height: 100%"> <head> <meta charset="utf-8"> </head> <body style="height: 100%; margin: 0"&
2018-06-19 11:25:11
7330
转载 前端开发人员快速创建本地服务器
参考：https://www.jianshu.com/p/554c09c237f1创建本地服务器的方法自己用过几种，比较来说node的http-server模块是最简单，最快速的（应该还有更好的）也许你用过wampserver，phpnow等集成包创建本地服务器，使用过程中大家应该会遇到两个棘手问题：1.尤其windows环境下，莫名其妙安装不了，或者启动不了 2.phpnow需要...
2018-06-19 11:09:12
1032
原创 高德地图系列之多边形polygon、行政边界查询districtExplorer、海量麻点MassMarks
多边形polygon：<!DOCTYPE html><html><head><title>map</title><script type="text/javascript" src=""></script><style type="
2018-06-14 17:36:19
13557
1
转载 传统 Ajax 已死，Fetch 永生
转自：https://segmentfault.com/a/1190000003810652另可参考fetch常见问题及解决办法：https://segmentfault.com/a/1190000008484070#articleHeader3原谅我做一次标题党，Ajax 不会死，传统 Ajax 指的是 XMLHttpRequest（XHR），未来现在已被 Fetch 替代。最近...
2018-06-14 17:27:15
369
转载 前端js压缩图片并上传
转自：https://segmentfault.com/a/1190000012037041公司最近有需要压缩上传图片功能，查找了些资料并实现了一把。主要用到的原生组件：FileReader、Canvas、Blob、FormData逻辑步骤：FileReader.readAsDataURL将上传的图片文件转为Base64格式 将img绘制到canvas上，canvas.toDat...
2018-06-14 17:17:31
725
原创 CSS总结（ CSS3 新特性 ）
CSS3新特性：https://segmentfault.com/a/1190000010780991#articleHeader41超出省略号有三行代码：禁止换行，超出隐藏，超出省略号overflow:hidden;white-space: nowrap;text-overflow:ellipsis;position属性css中position属性用于元素定位，其...
2018-06-14 14:51:14
442
原创 入门Webpack
Webpack的工作方式是：把你的项目当做一个整体，webpack从入口文件（如：index.js）开始，找到项目的所有依赖文件，使用loaders处理它们，最后打包成一个或多个浏览器可识别的js文件。核心概念：入口(entry) 输出(output) loader 插件(plugins)使用流程：npm init //生成package.json文件npm install...
2018-06-08 10:39:07
279
转载 开发 react 应用最好用的脚手架 create-react-app
转自：https://blog.csdn.net/qtfying/article/details/786656641. 介绍在开发react应用时，应该没有人用传统的方法引入react的源文件(js)，然后在html编辑吧。大家都是用webpack + es6来结合react开发前端应用。这个时候，我们可以手动使用npm来安装各种插件，来从头到尾自己搭建环境。比如：npm install reac...
2018-06-04 10:59:45
763
原创 react-amap填坑指南
报错：XX is not a constructorreact-amap的版本得升级到 1.1.1及以上，支持加载 AMapUI 组件库1. react-amap版本卸载package.json里面"react-amap": "^1.2.7"2. amap版本根据react-amap文档，写在Map组件里即可<Map version={'1.4.4'}//amap版本 a...
2018-06-02 16:56:57
4885
转载 Flow 是一个静态类型检测工具
参照：https://zhuanlan.zhihu.com/p/26204569Flow 是一个静态类型检测工具；在现有项目中加上类型标注后，可以在代码阶段就检测出对变量的不恰当使用。Flow 弥补了 JavaScript 天生的类型系统缺陷。利用 Flow 进行类型检查，可以使你的项目代码更加健壮，确保项目的其他参与者也可以写出规范的代码；而 Flow 的使用更是方便渐进式的给项目加上严格的类型...
2018-05-21 16:10:51
641
转载 Graphql只是一种用于 API 的查询语言!!!!
Graphql只是一种用于 API 的查询语言详解见：GraphQL入门 https://blog.csdn.net/future_challenger/article/details/54773541
2018-05-21 15:11:39
911
原创 sublime 下安装 babel插件
React开发时，有的文件显示为plain text，为优化显示：打开sublime，ctrl+shift+p（MacCmd+shift+p），输入Install Package（IP）搜索，输入babel安装。重启sublime查看（view）>语法>Open all with current extension as...>Babel>JavaScript（babel）...
2018-05-19 17:18:07
2015
转载 RN快速上手
转自骆神创建、陈神修改，仅供学习1、开发环境的快速搭建1.1 Homebrew的安装Homebrew, Mac系统的包管理器，用于安装NodeJS和一些其他必需的工具软件。使用以下命令安装：/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"注：在Max ...
2018-05-17 15:40:14
370
转载 谈一谈创建React Component的几种方式 及 ref
转自：https://segmentfault.com/a/1190000008402834当我们谈起React的时候，多半会将注意力集中在组件之上，思考如何将页面划分成一个个组件，以及如何编写可复用的组件。但对于接触React不久，还没有真正用它做一个完整项目的人来说，理解如何创建一个组件也并不那么简单。在最开始的时候我以为创建组件只需要调用createClass这个api就可以了；但学习了...
2018-05-08 15:48:46
1549
转载 按位与(&)在权限设计方面的用法
转自：https://blog.csdn.net/jjddrushi/article/details/52303628传统的权限设计需要设计权限表和桥表，这样造成的数据冗余是相当大的，且数据表的查询也消耗掉 不少时间。 利用按位与(&)的一些数学特性可以取代这些。 例如： 1 代表超级管理员 2 代表商务 4 代表运营 2的n次方 … 而，你的权限是3，那么就代表你拥有1和2两个权限，7就...
2018-05-07 15:13:05
1247
原创 怎样做好前端
种一棵树最好的时间是十年前，其次是现在谦虚 谨慎 多学习现阶段，包括各大招聘网站招聘规则，前端的主要作用就是实现页面，以及将后台数据按需求展示出来，更深一点的是，快速解决各种问题，快速开发，性能优化。更更深一点的职能是了解原理以及服务器等后台理论。 说一下工作感悟吧，良好的人际关系是一剂良药，能让人工作身心愉悦，技术上跟新，每天花两个小时学一些自己的东西，充盈自己的大脑和底气，生存之道...
2018-05-04 14:47:19
444
原创 javascript的函数传递and匿名函数
在JavaScript中，函数和其他变量一样都是可以被传递的，如：function say(w){alert(w)};function exe(func,val){func(val)};exe(say,"Hi!!")我们可以直接在另一个函数的括号里直接定义和传递，甚至不用给函数起名字，匿名函数：function exe(func,val){func(val)};exe(function(w){al...
2018-05-02 14:28:25
176
原创 react生命周期详解
参照：https://www.jianshu.com/p/4784216b8194测试例子：http://wximg.gtimg.com/shake_tv/test/lifeCycle2113.htmlreact生命周期函数：1. constructor(props,context)；2. componentWillMount()挂载前调用，一次，如果此函数内调用setState，本...
2018-04-24 11:50:18
946
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人