- 博客(23)
- 收藏
- 关注
RSS订阅原创 图片上传
form表单内包含图片上传，且需要用formData传值上传组件封装<template> <div class="upload-img"> <img :src="imageSrc" v-if="imageSrc" class="img"> <div class="upload-btn" v-if="!imageSrc">...
2019-12-11 16:24:58
204
原创 ES6 字符串的扩展处理
ES6 新增了字符串的处理方法，这里我就常用的几个进行整理：1、字符串的遍历器接口ES6 为字符串添加了遍历器接口，使得字符串可以被for...of循环遍历简单补充一下上面提到的遍历器：遍历器（Iterator）就是这样一种机制。它是一种接口，为各种不同的数据结构提供统一的访问机制。任何数据结构只要部署 Iterator 接口，就可以完成遍历操作（即依次处理该数据结构的所有成员）...
2019-01-18 16:10:01
202
原创 ES6 变量的解构赋值用途
1、交换变量的值let x = 1;let y = 2;[x, y] = [y, x];2、从函数返回多个值函数只能返回一个值，如果要返回多个值，只能将它们放在数组或者对象里返回。取值的时候可以利用解构赋值// 返回一个数组function example() { return [1, 2, 3];}let [a, b, c] = example();//...
2019-01-14 16:51:23
224
转载 Traceur 转码器 将 ES6 代码转为 ES5 代码
文章摘自《ECMAScript 6 入门 》Traceur 允许将 ES6 代码直接插入网页。首先，必须在网页头部加载 Traceur 库文件<script src="https://google.github.io/traceur-compiler/bin/traceur.js"></script><script src="https://googl...
2019-01-10 18:06:46
406
原创 Vue img中src地址无法访问时处理
最近做的项目中经常会有从后台获取图片地址，动态绑定到src上，但是当网络不好，或者后台给的地址无法访问时页面就没办法渲染，用户体验很不好一开始尝试了直接利用img原生属性onerror来设置默认图片<img class="room_img" onerror="javascript:this.src='@/assets/image/activity/defaultImg.jpg'" ...
2018-12-29 10:27:16
2763
原创 Vue 在组件上使用v-model
Vue 的组件系统允许创建具有完全自定义行为且可服用的输入组件，这些输入组件可以和v-model一起使用。官方文档<input v-model="searchText">等价于：<input v-bind:value="searchText" v-on:input="searchText = $event.target.value">当用在...
2018-12-12 10:22:35
363
原创 JS阻止事件冒泡和取消默认事件
什么是事件流？浏览器最初开始支持事件时，同一个事件仅仅只有一个元素相应。后来认为仅仅支持一个单一事件是不够的，而IE4之后提出了事件流的概念，一个元素可以支持多个事件。常见的事件流有冒泡型事件和捕捉型事件。 事件捕获指的是从document到触发事件的那个节点，即自上而下的去触发事件 ；需要注意的是IE浏览器不支持捕获类型事件；相反的，事件冒泡是自下而上的去触发事件添加事件监听时阻...
2018-12-11 12:10:47
326
转载 九个很受欢迎的vue前端UI框架
一、Element官网地址：http://element-cn.eleme.io/#/zh-CN介绍：element ui框架的按钮组件，这款由饿了么前端开源的UI框架，一经面世，就收获大量程序员的芳心。在github 上更是高达29.8k的star早已说明一切。用于开发PC端的页面还是绰绰有余的。如果说你是用vue开发者，却没用过element UI，那你肯定不是合格的vue开发者。...
2018-11-29 11:16:06
936
原创 Vue 2.0 v-model的用法
你可以用 v-model 指令在表单 <input>、<textarea> 及 <select> 元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。它负责监听用户的输入事件以更新数据，并对一些极端场景进行一些特殊处理。v-model 会忽略所有表单元素的 value、checked、selected 特性的初始值而总是将 ...
2018-11-28 17:45:26
665
转载 纯css3云彩动画效果
效果演示黑天到白天的渐变过渡HTML<!doctype html><html lang="zh"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"
2018-11-26 14:35:39
1067
原创 js 设置滚动条平滑滚动
自定义实现滚动条平滑滚动，上接（利用vue 插槽实现滚动分页）：https://blog.csdn.net/caroline_Luoluo/article/details/84338803<div class="ScrollView" ref="ScrollView"> // 内容省略</div>private setScrollAnimate() { ...
2018-11-22 16:08:04
1783
原创 Vue slot 插槽
一、基础Vue 实现了一套内容分发的 API，将 <slot> 元素作为承载分发内容的出口它允许你像这样合成组件：<navigation-link url="/profile"> Your Profile</navigation-link>然后你在 <navigation-link> 的模板中可能会写为：<a ...
2018-11-22 15:56:05
310
原创 Vue 自定义filter日期格式化方法
毫秒数（如：1541561246000）转日期（2018-11-07 11:27:26）先建一个timeUtil.ts的文件，将格式化方法作为公共文件可以全局调用export function formatDate(fmt: string,time: Date) { // author: meizz const a = new Date() const o: any...
2018-11-07 14:32:47
670
原创 Vue-cli3.0 +Typescript
在typescript环境下，vue的属性、事件等写法有很大的不同，在这里做一个总结：import { Component,Vue, Prop, Emit , Watch } from 'vue-property-decorator';一、计算属性javascriptcomputed: { // 计算属性的 getter reversedMessage...
2018-11-07 12:12:23
5057
原创 Vue依赖注入 provide 和 inject
允许一个祖先组件向其所有子孙后代注入一个依赖，不论组件层次有多深，并在起上下游关系成立的时间里始终生效provide 选项允许我们指定我们想要提供给后代组件的数据/方法provide 选项应该是一个对象或返回一个对象的函数 provide: function () { return { getMap: this.getMap }}// 或者provide...
2018-11-07 10:38:05
3311
转载 跨域几种方式
本文转自微信公众号【web前端开发】一、什么是跨域JavaScript出于安全方面的考虑，不允许跨域调用其他页面的对象。那什么是跨域呢，简单地理解就是因为JavaScript同源策略的限制， a.com 域名下的js无法操作 b.com 或是 c.a.com 域名下的对象。当协议、子域名、主域名、端口号中任意一个不相同时，都算作不同域。不同域之间相互请求资源，就算作“跨域”。例如：...
2018-11-05 10:01:11
3744
原创 Html2canvas在Vue中的使用
html转canvas，可用于截图（附官网链接：http://html2canvas.hertzen.com/）截图（仿写了一个微信聊天界面φ(>ω<*)） 使用说明1、引入 JS 文件<script src="../js/html2canvas.js"></script>或者使用 ...
2018-11-02 15:56:15
16039
5
转载 网页水印插件 --- gwm.js
用于内部系统生成水印，可提示信息安全与责任追踪本文转自： https://github.com/loadchange/gwm特性支持生成 canvas、svg、element 三种类型水印 支持元素监控，防止篡改 可扩展性强使用说明1、引入js文件<script src="../js/gwm.js"></script>或者使用 npm 安装...
2018-11-02 14:57:54
3311
转载 js对url进行编码和解码（三种方式区别）
本文转自：https://www.cnblogs.com/z-one/p/6542955.html*** 只有 0-9[a-Z] $ - _ . + ! * ' ( ) , 以及某些保留字，才能不经过编码直接用于 URL。***例如：搜索的中文关键字，复制网址之后再粘贴就会发现该URL已经被转码。1、escape 和 unescape原理：对除ASCII字母、数字、标点符号 @ ...
2018-11-02 14:34:46
1346
原创 Element-ui el-upload文件上传
element-ui 文件及图片上传功能<el-upload class="upload-demo" auto-upload :show-file-list="false" :action="uploadUrl" name="pic" :before-upload="beforeUpload" :on-success="uploadSuccess&qu
2018-10-11 11:37:23
1024
原创 Vue + TypeScript + ElementUI 自定义实现下拉动画效果
刚刚完成的项目中有很多默认不显示，点击下拉出现的功能一般来讲这种功能纯CSS就可以实现，但是前提要知道高度。那如果内容的高度未知怎么办呢？ElementUI 有个Collapse 折叠面板的组件 http://element-cn.eleme.io/#/zh-CN/component/collapse那我可不可以只用下拉的那个效果呢，嗯哼？我们来看看源码在node_module...
2018-08-09 16:17:57
2921
原创 vue-cli3.0 创建项目
这里需要nodejs环境，如未安装请点这里https://nodejs.org/en/download/一、安装vue-cli 3.x （目前最新版已更新至 3.5.1）npm install --global @vue/cli // 或者yarn global add @vue/clivue3.x默认使用yarn 进行依赖安装和运行安装成功后执行vue -V（注...
2018-08-09 15:25:12
1764
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人