- 博客(54)
- 收藏
- 关注
原创 vuex state mutation action 之间关系,axios 跨域代理请求问题
1.vuex,状态管理模式 主要有state、view、actions三个部分,vuex通过在 main.js 中注入store,将这种状态从根组件注入到每个子组件中,在store中导入vuex,调用时需要 Vue.use(Vuex),子组件可以通过 this.$store 访问。如果改变store 的状态唯一方法就是提交 mutation,mutation中会接收state作为第一个参数,也可以...
2018-03-09 18:36:44
1363
原创 vue axios 使用
一、安装npm install axios二、在main.js引入,同时在 new Vue中注入axiosimport axios from '../node_moduels/axiosVue.prototype.axios = axios // 通过修改原型链方便使用,此处用的是 axios,可以更改名字,但是在methods中,名字一致new Vue({ el: '#app', ...
2018-03-09 09:53:38
773
原创 webstrom license server 激活破译
注册时,在打开的许可证激活窗口中选择“许可证服务器”,在输入框输入下面的网址:WebStorm许可证服务器:2017年10月16日更新:http://idea.iteblog.com/key.php(本人使用这个)2018年1月6日更新:http://idea.imsxm.com/两种方式都尝试一下点击:激活即可。...
2018-03-07 09:29:47
2600
原创 ECMAScript6(六)异步操作之Promise
Promise:是es6中新增的异步编程解决方案,体现在代码中它是一个对象,可以通过Promise 构造函数来实例化new Promise(cb) ===> 实例的基本使用 Pending Revolved Rejected两个原型方法:Promise.prototype.then()Promise.prototype.catch()let arr = [ 'https://timg...
2018-02-28 11:26:50
245
原创 ECMAScript6(五) 内置对象的扩展和箭头函数
1.模版字符串let bOn = false;let html = `<ul> <li> <span>首页</span> <span>${`首页`}</span> // 字符串的拼接 ...
2018-02-28 10:01:20
192
原创 ECMAScript6(四) Symbol数据类型
1.symbol:表示独一无二的值,是js中的第七种数据类型symbol 函数前不能使用new 否则会报错,原因在于symbol是一个原始类型的值,不是对象symbol 函数会接收一个字符串作为参数,表示对symbol的描述,主要是为了在控制台显示,或者转为字符串的时候,容易区分。let s1 = Symbol('s1'); // 仅仅为了描述和区分let s2 = Symbol('...
2018-02-27 18:11:36
208
原创 拼写快捷方式,es6方式,数组去重
1.编译器中,快捷方式写法<UL> li * 5 //按住Tab键会自动补全,生成5个li标签 < li > </ li > < li > </ li > < li > </ li > < li > </ li > < li &a
2018-02-27 17:08:46
230
原创 学习vue(二) localStorage存储
h5 localStorage:实现本地存储 vue todolist案例(实现刷新页面,数据仍然存在)新建一个vue项目,在App.vue同级目录下新建store.js文件,同时在App.vue中引入Store import Store from '.store'新建文件 store.js const STORAGE_KEY = 'todos-vuejs'export default { ...
2018-02-26 15:00:23
7458
1
原创 学习vue(一)
<script src="https://cdn.jsdelivr.net/npm/vue"></script><body> <div id="app"> <span> {{ message }} </span> <span> {{
2018-02-17 17:31:50
324
原创 js 将图片链接转换成base64格式的简单实例
简单案例<!DOCTYPE html><HTML><HEAD> <meta name =“viewport”content =“width = device-width”/> <title> jquery图片base64 </ title></ HEAD><BODY&g
2018-01-31 15:25:26
2258
原创 canvas 使绘制的图片在div 居中显示 ,解决绘图模糊问题
一:绘图在div 居中显示:首先把canvas当成未知的图片来处理,未知图片的居中显示如下:二:绘图模糊canvas作为画布,不能用css和style的方式设置宽高,他有自己特定的属性,width和height。不管当前的图片有多大,画布的宽高设置为图片的二倍,ctx.drawImge()绘制图片后,在用canvas的css再次定义,使其的宽高和图片大小一直,就可以解决canvas绘制
2018-01-19 18:29:18
6000
原创 jquery 图片的尺寸来判断图片是横图还是竖图,判断过后给予不同的展示方式
Title * { margin: 0; padding: 0; } ul { list-style:none; margin: 0; padding: 0; } ul li {
2018-01-13 23:28:39
4213
原创 css+jquery 进度条
CSS Graph .loading-status { width: 320px; border: 1px #42A9FF solid; -webkit-box-shadow: 0px 2px 2px #D0D4D6; height: 19px; -we
2018-01-13 16:34:45
163
原创 css实现左边div固定宽度,右边div自适应撑满剩下的宽度
Title .use-float>div:first-child{ width:100px; float:left; background: red; } .use-float>div:last-child{ overflow:hidden;
2018-01-11 09:52:17
704
原创 在mac上开启httpServer服务
1,打开终端,开启http服务 ios系统自带apache服务,用命令行:sudo apachectl start 开启http服务(可能会需要输入密码,密码为开机密码)2,cd到要共享的文件夹内(如果不清楚路径,可以直接将要共享的文件夹拖拽入终端),再用命令行python -m SimpleHTTPServer 在http上共享文件夹内容
2018-01-10 11:20:50
8284
原创 canvas 基础
canvas 是一个二维网格获取canvas var c = document.getElementById('myCanvas');创建2d空间 var ctx = c.getContext('2d');设置颜色 ctx.fillStyle = "#000";定义矩形的填充方式 ctx.fillRect(x,y,width,height);can
2017-12-26 17:05:45
319
原创 自定义上传图片样式,同时实现多图片的上传和预览
功能:自定义上传按钮的样式,初始样式的透明度为0,设置自己想要的样式,同时可以实现上传图片的预览。
2017-12-25 18:24:55
1132
原创 input type="flie" 图片上传 预览
隐藏input控件透明度opacity=0的办法,图片的预览实现原理使用了javascript里的createObjectURL方法。css部分: * { margin: 0; padding: 0; list-style: none; } body { position: relative;
2017-12-19 15:05:48
361
原创 framework7 UI组件对照表
framework7 UI组件对照表 Modals 模态弹层 Contacts List 联系人列表 Swiper Slider 幻灯片
2017-10-23 09:27:06
3088
原创 git工具的基本使用
版本库又名仓库,可以理解为是一个目录,这个目录里面的所有文件都可以被Git管理起来,每个文件的修改、删除,Git都能跟踪,以便任何时刻都可以追踪历史,或者在将来的某一刻可以‘还原’。创建版本库创建一个新的文件夹为myGit mkdir myGit进入新建的文件夹myGit中 cd myGit显示myGit文件夹的位置 pwd初始化myGit文件夹
2017-10-17 13:59:48
198
原创 模块打包工具webpack的使用
webpack是什么1.模块化2.自定义文件或npm install (整个项目完成后,可以将整个项目进行模块化,模块化分为两种,一是自定义的文件(自己创建的css文件或者js文件),而是引用的文件(比如bootstrap或者angular))3.静态文件模块化(比如css文件)4.借助于插件和加载器webpack的优势:1.代码分离2.装载器(css,sass
2017-09-15 09:18:07
504
原创 前端常见的知识点(一)
各个浏览的内核和前缀 添加、移除、移动、复制、创建和查找节点要想写出跨浏览的CSS,必须要知道浏览器解析CSS的两种模式:标准模式和怪异模式未知div大小,实现垂直水平居中与浏览器中的实现方式 数组去重浏览器兼容性问题 DOCTyps作用 Ajax请求过程 常见的HTTP状态码解决HTML5新标签的浏览器兼容问题 如何减少HTTP请求,提高性能 对作用域的理解 前端性能优化的方式 Ajax请求数据时,get和post的区别
2017-09-14 19:30:28
395
原创 GitHub上如何使用git工具以及git的使用命令
git创建远程仓库git clone --bare robbin_site robbin_site.git # 用带版本的项目创建纯版本仓库scp -r my_project.git git@ git.youkuaiyun.com:~ # 将纯仓库上传到服务器上mkdir robbin_site.git && cd robbin_site.git && git --bare init # 在服务器创建纯仓库git remote add origin git@ github.com:robbin/ro
2017-09-14 16:53:44
243
原创 用git将项目代码上传到github
注册账户以及创建仓库1.进入你的GitHub账号,点击New repository进入,输入项目名称,我取名为demo,确定名称后,点击Create repository2.创建完成后,会显示如下所示的页面3.设置key 1)在本地创建ssh key $ ssh-keygen -t rsa -C "your_email@youremail.com"() 后面的your_email@youremail.com改为你的邮箱。我的邮箱是lilu@1ke.co,也是在github上注册的那个邮箱,输
2017-09-14 15:31:48
403
原创 angular2-学习笔记(三)
创建的angular2项目中,在src文件夹中 main.ts 固定以下代码。主要是为了启动页面import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';import { AppModule } from './app.module';platformBrowserDynamic().bo
2017-09-11 18:10:04
178
原创 angular2-学习笔记(二)
组件(Component):是对数据和方法的简单封装根组件导航组件 Home组件 Directory组件|.component.ts.component.html .component.css组件逻辑 组件视图 组件样式创建组件:在命令行中 进入你的根组件中 输入 ng generate component Name(项目名称)组件的命名组件的类名应该是大驼
2017-09-08 09:28:38
229
原创 angular2-学习笔记(一)
配置angular2的环境:1.首先在电脑上安装node.js2.打开命令行,查看版本信息 node -v // node.js的版本信息 npm -v // npm的版本信息3.安装angular-cli,同样是在命令行上执行 npm install -g cnmp --registry=https://registry.npm.taobao.org (安装npm容易出错,所以建议安装cnpm,也就是淘宝镜像) cnpm install -g @angular/cli4.判断是否安装成功
2017-09-07 16:22:47
321
原创 ECMAScript6(三)
Iterator 和 for...of循环在ES6中新增了Set和Map两种数据结构,再加上JS之前原有的数据和对象,这样就有了四种数据集合,平时还可以组合使用它们,定义自己的数据结构,比如数组的成员是Map,Map的成员是对象等,这样就需要一种同一的接口机制,来处理所有不同的数据结构。Interator就是这样的一种机制,它是一种接口,为各种不同的数据结构提供同一的访问机制,任何数据结构
2017-09-06 19:12:41
270
原创 angular2的配置环境
angular2的环境配置1.打开命令行2.进入到nodeJs所在文件的目录3.进入nodeJs中4.输入命令 npm install express -gfNPM是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题,常见的使用场景有以下几种:允许用户从NPM服务器下载别人编写的第三方包到本地使用。允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。
2017-09-05 13:36:22
255
原创 ECMAScript6(二)
数据结构Set集合的基本概念:集合是由一组无序且唯一(既不能重复)的项组成,这个数据结构使用了与有限集合相同的数据概念,应用在计算机的数据结构中。特点:key和value相同,没有重复的value。ES6 提供了数据结构Set,它类似于数组,但是成员的值都是唯一的,没有重复的值1.如何创建一个Setconst s = new Set([1,2,3,4])console.lo
2017-09-05 09:09:01
160
原创 ECMAScript6(一)
let命令:用来声明一个变量,和var非常类似const命令:用来声明一个常量,常量就是不可以变化的量解构赋值基本概念:本质上就是一种匹配模式,只要等号两边的模式相同,那么左边的变量就可以被赋予对应的值解构赋值主要分为:1.数组的解构赋值 2.对象的解构赋值 3.基本类型的解构赋值
2017-09-04 18:29:50
287
原创 移动端学习笔记(二)
document.addEventListenter(‘touchstart’,function(ev){ ev.preventDefault()})可以解决:1.IOS10下设置meta禁止用户缩放是不可行的,可以用pc事件解决2.解决IOS10下的溢出隐藏3.禁止系统默认的滚动条、阻止橡皮筋效果4.禁止长按选中文字、选中图片、系统默认菜单5.解决点透问题6.同时阻止了焦点元素的焦点行为(要想正常使用,ev.stopPropagation()(阻止冒泡))事件对象:当给某个元素加上了事件绑
2017-08-03 19:33:22
230
原创 移动端学习笔记(一)
viewport:视口(可视区窗口)默认不设置viewport一般可视区宽度在移动端是980width:可视区域的宽度(number || device-width)user-scalable:是否允许用户缩放,如果user-scalable = no,则说明不可以缩放 user-scalable = yes,允许用户缩放(iOS10无效)默认字体设置:Helvetica清除点击的阴影:-webkit-tap-highlight-color消除按钮圆角:-webkit-appearance ,如
2017-08-02 23:31:26
314
原创 NodeJs(一)
在ECMAScript部分,nodejs和js其实是一样的,比如数据类型的定义,语法结构,内置对象在js中的顶层对象是window在node中的顶层对象是global(在node中没有window)在node中,一个文件就是一个模块,每个模块都有自己的作用域,使用var声明的变量,并不是全局变量,而是当前模块下的_filename:返回当前模块文件被解析后的绝对路径(每个模块下都有
2017-07-31 13:04:48
195
原创 vue.js(一)
vue 响应数据绑定(不兼容ie8),当数据发生改变时,会自动更新视图利用 Object.definedProperty 中的setter / getter 代理数据,监控对数据的操作MVVM : M : model 数据模型 V:view 视图模板 VM:view-model 视图模型案例: // v-model 实现数据双向绑定 {{ name
2017-07-27 12:31:22
262
原创 Angular.js(七)
自定义服务factory、provider注意:(1)自定义服务与内部的服务引入相同 (2)自定义服务要写在内部的服务后面,并且自定义服务的命名一般不要带$符号,目的就是与内部服务区分factory自定义服务写法:var m1 = angular.module('myApp',[]);m1.factory('myService',function(){ re
2017-07-25 19:41:19
276
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人