- 博客(38)
- 资源 (2)
- 收藏
- 关注
RSS订阅转载 vue 实践技巧合集
本文不涉及罕见API使用方法等，大部分内容都是基于对vue的一些实践而已。由于涉嫌投机取巧，可能会带来一些不符合规范的副作用，请根据项目要求酌情使用。1. 多个页面都使用的到的方法，放在vue.prototype上会很方便刚接触 vue 的时候做过一件傻事，因为封装了一个异步请求接口post,放在 post.js 文件里面，然后在每个需要使用异步请求的页面引入import port ...
2018-07-19 12:35:06
695
原创 JavaScript深拷贝的一些问题
javascript之Object.assign()痛点javascript之Object.assign()痛点JSON.parse(JSON.stringify(obj)) + 使用for...in加递归JavaScript深拷贝的一些坑
2018-06-22 10:57:06
339
原创 JavaScript 执行机制 --Event Loop
就放两篇文章的链接，认真看完就懂了！！！这一次，彻底弄懂 JavaScript 执行机制一个Promise面试题
2018-05-15 14:42:18
256
原创 vue 点击按钮增加一行
data() { return { customized_descs: [1]， } },不要js,jq里面的方法了。。。
2018-05-11 16:18:37
21902
原创 clipboard异步复制文本，点击按钮发起异步请求进行复制
需求描述：点击按钮，发起一个异步请求，将请求到的数据复制到剪切板。emmmmm半天尝试了很多百度来的方法，都不能满足需求，后面使用了Clipboard.js动态设置文本的方法和把ajax请求设置为同步的，实现了异步的复制。clipboard.js使用方法介绍直接看实现代码：<b-button id="LinkBtn" class="myLinkBtn btn" @click="CopyMyL...
2018-05-03 14:50:41
4254
原创 app.use(async(ctx, next) => {} 报错Unexpected token (
node 版本不够 升级nodewindows下升级 可以直接到官网下载 跟原来在低版本在同一个目录下就会自动覆盖
2018-04-07 20:39:06
3856
原创 .attr() 和 .css()
css: 是设置和获取 style 的。（ .css("display","none") ）var myId = $("#myId");myId.css("background-color", "red"); // 设置背景颜色为红色var bg = myId.css("background-color"); // 获取背景颜色相当于：var myId = document.getEl
2018-04-07 20:13:33
830
原创 给动态生成的a绑定click事件未生效
如题：jq使用on()绑定动态生成元素的事件未生效！！！jq的on()方法可以绑定动态生成元素的事件，但在实际使用时未生效。例如：<p> <a>123</a></p> 使用如下方式，对静态元素有效，但是绑定动态生成的a元素的事件时无效：$('a').on('mouseenter',function(){ // TODO:});此时需要绑定...
2018-04-05 11:45:36
2538
转载 windows下node升级
看了很多命令行升级node的文章，结果因为Windows环境一直解决不了。所以最简单的方法就能完成，windows下需要升级nodejs 仅仅需要安装最新的msi 。下载地址： https://nodejs.org 注意事项：注意自己原来是安装在 Program Files (x86) 还是 Program Files，需要与原来文件夹保持一致...
2018-03-31 16:05:55
4818
转载 vue2 broadcast和dispatch的理解
/* broadcast 事件广播 @param {componentName} 组件名称 @param {eventName} 事件名 @param {params} 参数 遍历寻找所有子孙组件，假如子孙组件和componentName组件名称相同的话，则触发$emit的事件方法，数据为 params. 如果没有找到 则使用递归的方式 继续查找孙组件，直到找到为止，否则继续递归查找，...
2018-03-22 16:06:15
2277
原创 JS闭包
闭包的形成与变量的作用域以及变量的生存周期密切相关。变量的生存周期 对于全局变量来说，全局变量的生存周期当然是永久的，除非我们主动销毁这个变量。而对于在函数内用var关键字声明的局部变量来说，当退出函数时，这些局部变量就失去了他们的价值。var func = function () { var a = 1; // 退出函数后局部变量a将被销毁 a...
2018-03-22 15:29:05
223
转载 vue中v-model详解
v-model在input元素上时v-model虽然很像使用了双向数据绑定的 Angular 的 ng-model，但是 Vue 是单项数据流，v-model 只是语法糖而已。第一行的代码其实只是第二行的语法糖。<input v-model="sth" /><input v-bind:value="sth" v-on:input="sth = $event.target.val...
2018-03-13 14:49:02
68014
原创 如何实现响应式图片
记录几种实现响应式图片的方法。一.,js或服务端通过js或者服务端来控制图片的加载，原理就是跟踪window的resize事件，然后修改图片的路径，代码如下<body><div class="content"> <img src="" alt=""/></div><script src="js/v
2018-03-07 19:43:28
5551
原创 上传项目到github报错：Permission to xxx/xxx.git denied to xxxxxxx.
今天在上传项目到github时遇到了一个问题解决方案：win10 系统下进入控制面板 》 用户帐户 》 管理你的凭据选择 [Windows 凭据]git 保存的用户信息在普通凭据列表里>>编辑>>>完成推测为操作系统的缘故，由于某些操作我的git记录下来了别人的账号密码，直接删除或者改成自己的就好。ps：辣鸡操作系统啊啊啊啊啊啊...
2018-02-08 17:53:15
2888
原创 vue-lazyload懒加载插件介绍和应用
如下可以看到当我们刷新页面时，图片的请求特别多但实际上我们首屏幕上只有几张图片，那能不能做到我们只去请求首屏的图片，而其他图片当我们滚动到它的时候再去请求和加载。就是我们常说的图片懒加载技术。在此利用vue的第三方插件vue-lozyload。Github链接：https://github.com/hilongjw/vue-lazyloadnpm下载安装成功后，在main.js
2018-02-06 15:08:25
1097
原创 理解JSONP和用例
参考了一篇博客，记录下自己对JSONP的理解和用例，博客地址见文末。简单来说，Ajax直接请求普通文件存在跨域无权限访问的问题，这时需要在远程服务器上设法把数据装进js格式的文件里（这些动态生成的js格式文件一般为JSON数据文件），客户端在对JSON文件调用成功之后，就是获取自己需要的数据后，剩下的就是按需处理。为了便于客户端使用数据，逐渐形成了一种非正式传输协议JSONP，该协议的一个
2018-01-30 22:00:16
255
原创 面向对象的JavaScript
一.鸭子类型在JavaScript中，当我们对一个变量进行赋值时，显示不需要考虑它的类型，因此，JavaScript是一门典型的动态类型语言。动态类型语言对变量类型的宽容实际给编码带来了很大的灵活性。由于无需进行类型检测，我们可以尝试调用任何对象的额任意方法，而无需去考虑它原本是否被设计为拥有该方法。这一切都建立在鸭子类型的概念上，通俗说法是：“如果它走起路来像鸭子，叫起来也是鸭子，那
2018-01-25 09:23:23
229
原创 JS中的this，call，apply
一.thisJS中的this总是指向一个对象，而具体指向哪个对象是在运行时基于函数的执行环境动态绑定的，而非函数被声明时的环境。this的指向：1.作为对象的方法调用当函数作为对象的方法被调用时，this指向该对象：var obj = { a: 1, getA: function () { al
2018-01-25 09:22:42
282
原创 JS设计模式--代理模式
保护代理与虚拟代理代理B可以帮助A过滤掉一些请求，这种代理叫做保护代理。一些操作交给代码B去执行，代理B会在时候的时候交给A，这是代理的另一种形式，虚拟代理。虚拟代理把一些开销很大的对象，延迟到真正需要他的时候才去创建。保护代理用于控制不同权限的对象对目标的访问，但在js并不容易实现保护代理，因为我们无法判断谁访问了某个对象。而虚拟代理是最常用的一种代理模式，这里主要研究虚拟代理。虚拟
2017-12-27 12:37:00
287
原创 JS设计模式-策略模式
一个根据等级计算奖金的例子。var stratagies = { "S": function (salary) { return salary*4; }, "A": function (salary) { return salary*3;
2017-12-26 14:13:07
248
转载 JS设计模式-单例模式
学习js设计模式的过程中，把分析和学到有用的知识记录下来。惰性单例模式假设我们点击登录时弹出一个登录浮窗，很明显这个浮窗在页面里总是唯一的，不可能出现同时出现两个登录窗口的情况。第一种解决方案是在页面加载完成时便创建好这个div浮窗，这个浮窗一开始肯定是隐藏状态的，当用户点击登录按钮的时候，它才开始显示： <button id="loginBtn">登录<t...
2017-12-24 13:58:34
240
原创 vue底部加载更多
要实现的效果如下： class="newsList"> v-for="(items, index) in newsList"> class="date">{{showDay(index)}} class="list" > class="list-item" v-for="item in items">
2017-12-10 10:41:22
15694
转载 Vue-cli proxyTable 解决开发环境的跨域问题
和后端联调时总是会面对恼人的跨域问题，最近基于Vue开发项目时也遇到了这个问题，两边各自想了一堆办法，查了一堆资料，加了一堆参数，最后还得我把自己的localhost映射成上线时将要使用的域名。今天翻看代码时，突然发现vue-cli的config文件里有一个参数叫proxyTable，看这个名字就感觉能解决问题，于是我就去搜了一下，果然。在vuejs-templates，也就是vue-cli的
2017-12-06 13:19:01
275
原创 公用的vue小组件
一.BaseCounter接收参数max、min，当number内容改变时返回父组件on-change事件//counter.vue class="counter-component"> class="counter-btn" @click="minus"> - class="counter-show"> type="text" v-model
2017-11-29 21:29:38
2430
原创 一个用vue写的小网站 过程梳理 一些记录
先看实现后的效果：点击立即购买：确认购买：支付成功后跳转到订单列表页面：项目目录把导航和底部的内容layout.vue作为跟组件先完成导航部分的制作，包括登录弹窗的显示，其中涉及到的有layout、dialog、logForm.vue//layout.vue class="app-head">
2017-11-29 19:33:52
8443
原创 vue中简单弹框dialog的实现
效果如下，dialog中内容自行添加 class="dialog-wrap"> class="dialog-cover" v-if="isShow" @click="closeMyself"> name="drop"> class="dialog-content" v-if="isShow"> class="
2017-11-29 16:29:04
23963
原创 Vue中一些需要注意的点（采坑）
前言：记录在学Vue中需要注意的问题1.给link添加事件、给组件绑定原生事件在vue-router1中使用v-link写入路由，但是在vue-router2中要使用router-link写入路由，在浏览器渲染的时候会把router-link渲染成a。有时候需要为router-link注册事件，对于一般的html元素，直接使用@click="eventFun"即可，但是对于rout
2017-11-23 16:29:25
30658
原创 vuejs 幻灯片组件发开
实现一个幻灯片组件 回顾一下在vue里面组件之间的交互，父组件向子组件传递信息，通过的是子组件的属性props；子组件想要通知父组件一些事件，是通过自定义事件来实现的。那么想一下，幻灯件作为子组件，需要怎样的属性和事件呢？在事件上，可以设置一个onchange事件，每一次幻灯片切换了，都会通知父组件，这个事件可以带一个参数，可能是当前在哪个页面；父组件需要告诉子组件我们要展示的图
2017-10-30 18:59:52
7029
原创 vue-resource + json-server模拟数据 vue-cli配置
一、安装npm install vue-resource --savenpm install json-server --save二、配置与使用vue-resource// main.jsimport VueResource from 'vue-resource'Vue.use(VueResource) this.$http.get('api/getNe
2017-10-30 08:40:01
495
转载 vue.js原生组件化开发——父子组件
前言在了解父子组件之前应先掌握组件开发基础。在实际开发过程中，组件之间可以嵌套，也因此生成父子组件。父子组件创建流程1.构建父子组件1.1 全局注册(1)构建注册子组件/构建子组件childvar child = Vue.extend({ template: '这是子组件'});//注册名为'child'的组件Vu
2017-10-28 16:46:36
456
转载 vue-cli入门（三）——vue-resource登录注册实例
前言使用vue-resource请求接口非常方便，在使用前需安装vue-resource依赖并在入口文件main.js中声明。实例功能简述本实例只有简单的两个模块：登录和注册，主要演示如何用vue-resource请求接口以及后期逻辑书写。各个功能如下所示：登录模块登录-用户不存在登录-密码错误登录-成功注
2017-10-27 13:46:07
1320
转载 vue-cli入门（二）——人员管理实例小demo
前言在开始开发实例前，应首先了解一下vue-cli的项目结构。接着我们一起来实现一个小demo——人员管理，功能简单，通过这个实例让大家熟悉使用vue-cli开发项目的一些操作，加深对vue-cli项目结构的印象。实例功能简述人员管理项目，有两个页面，首页和管理页，管理页主要实现一个简单的增删改功能，各个功能如下所示。
2017-10-24 15:14:51
1400
转载 vue-cli入门(一)——项目结构
前言构建了一个vue-cli项目，网上教程很多，这里就不做详细赘述了。总体框架一个vue-cli的项目结构如下，其中src文件夹是需要掌握的，所以本文也重点讲解其中的文件，至于其他相关文件，了解一下即可。文件结构细分1.build——[webpack配置]build文件主要是webpack的配置，主要启动文件是dev-se
2017-10-24 14:44:19
660
转载 WebStorm 激活
安装完成后，在打开的 License Activation 窗口中选择 License server。在输入框输入网址：http://idea.iteblog.com/key.php最后点击 ok转载于http://blog.youkuaiyun.com/plain_maple/article/details/70144988
2017-10-24 09:29:35
338
转载 es6语法快速上手
随着google和firfox以及node6.0对es6的支持，es6语法的定稿使它越来越受到关注，尤其是react项目基本上都是用es6来写的。是时候从es5到es6转变了.一、相关背景介绍我们现在大多数人用的语法javascript 其实版本是ecmscript5,也是就es5。这个版本己经很多年了，且完美被各大浏览器所支持。所以很多学js的朋友可以一直分不清楚es5和javs
2017-10-23 18:29:18
641
转载 angualar创建自定义指令处理数据变化
提示：我打算分解这一处理变化的过程，因为我想演示关于指令在AngularJS与js之间经常发生的一个问题，并解释解决方案。在directives.html文件中改变值：html>lang="en" ng-app="exampleApp"> charset="UTF-8"> Directives src="angular.js"> rel="style
2017-10-21 10:18:11
462
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人