JS
清晏23
越努力,越平静
展开
-
vue自定义指令之图片加载失败
说到图片加载失败,我们都会想到这样处理<img src="/img/covers.png" alt="封面" onerror="javascript:this.src='/img/default.png'">这样处理没问题,但如果放到项目中,几十上百个页面,一个一个加,就太重复了;而且还有个问题,如果图片很大,加载时间过长,也会严重影响用户体验,所以,这里需要同时解决两个问题:1、在图片加载出来之前,给一个默认图片2、图片加载失败,用默认图片来代替回到代码层面,..原创 2020-09-23 18:19:06 · 984 阅读 · 0 评论 -
vue 读取 txt
项目中难免会碰到要显示各种协议, 像这样这时,产品会给你发一个word 文档,通常都有好几页面,这样大篇幅的文本,直接复制到页面就不合适了,再加上还要处理换行,费时费力,能够直接直接获取word内容,展示到页面最好不过,由于获取word乱码,这里暂用txt文本代替export default { date(){ return { agreement:{ user:"", pri.原创 2020-09-03 14:58:08 · 6393 阅读 · 1 评论 -
Vue 开发插件
所谓插件,其实就是一个在全局声明的组件,这里,我们集中封装,全局引入,从而便于管理,也能有效地提升开发效率和加载性能。 方法就是:将这个插件的逻辑封装成一个对象,最后将install编写业务代码暴露给Vue对象,也就是,要公开一个install方法([开发插件官方文档](https://cn.vuejs.org/v2/guide/plugins.html))。这里,以接口请求文档为例,...原创 2019-06-28 11:11:40 · 666 阅读 · 0 评论 -
Vue 组件通信
Vue 组件通信这块,其实在先前的文章《vue 组件传值》中就已经提过,总结了常用的五种方法:props、ref、emit、路由、vuex。 这里,考虑到实际项目中的开发需要,略加补充,一起探讨学习下!provide + inject (官档)provide / inject 是Vue.js 2.2.0 新增的 API,一种无依赖的组件通信方法。官档说明:这对选项需要...原创 2019-06-28 11:20:29 · 153 阅读 · 0 评论 -
Vue 手风琴 和 $set
最近,在开发项目的时候,要做一个手风琴,要求能**同时展开多个面板**,喏,也就是Element-ui 折叠面板这个型的:但需求是加了更改排序的功能,如下图,表现上自然不同了,先前提到的Element-ui折叠面板,满足不了,只能 DIY 一个。接着,啪叽一顿代码下来,大体如下。这里的方法是:给已有的数据对象添加新的属性。[color=#ff4753]*[/color]注...原创 2019-06-28 11:24:29 · 479 阅读 · 0 评论 -
小程序的分包加载
定义小程序分包加载,先看看官方解释:某些情况下,开发者需要将小程序划分成不同的子包,在构建时打包成不同的分包,用户在使用时按需进行加载。其实就四个字:按需加载!小程序优于 App 的地方,就在于小快灵。代码包从最初的不超过 1MB,涨到现在的 8M!大小在增加,要达到相同的用户体验,就只能少量多餐好消化了!目前小程序分包大小有以下限制:. 整个小程序所有分包大小不超过 8M...原创 2019-06-28 11:30:22 · 394 阅读 · 0 评论 -
Js 基础知识点
1、参数、块级作用域、变量、常量1)、变量提升var val = 1;function fn(){ console.log(val) var val = 100; console.log(val) };fn();结果:undefined,100 2)、变量和块级作用域,变量和常量var val = 1;function ...原创 2019-06-28 11:37:41 · 230 阅读 · 0 评论 -
ES6 笔记
1、let 和 const 命令let:块级作用域变量,const:常量首先,let 和 const,不存在变量提升。*使用时,先声明,后调用。console.log(a); //全局变量:undefinedconsole.log(b,c);var a = 1;let b = 2;const c = 3同时,相同作用域内,不能重复声明//报错let ...原创 2019-06-28 11:43:46 · 159 阅读 · 0 评论 -
Javascript 继承
说到继承,先来个开胃菜:求方法实现 f(6).num(1),结果等于6。 想到方法了吗?不如先来看一段代码:var $ = function(selector){ return new $.prototype.init(selector)};$.prototype = { constructor:$, init:function(selector)...原创 2019-06-28 11:49:37 · 181 阅读 · 0 评论 -
开始你的第一个Angular.js 项目
最近,换了新公司,要从Vue.js,转到 Angular.js ,这不,先得准备一下嘛!沐浴更衣,焚香戒斋,祭天祈祷,啊哈哈...跑偏了!话不多说,撸起袖子:开干,新建一个项目试试!第一步,安装node.js鉴于你可能用到不同版本的node.js,建议 安装nvm,具体教程,可参考文章《Nvm安装笔记》*注:可能出现当前node.js 版本,不支持使用的Angul...原创 2019-07-14 16:39:53 · 276 阅读 · 0 评论 -
车商通SCRM 10.0全新上线
一晃已是7月,自从1月入职车商通(驱动新媒体),两个人的开发组,就马上投入了车商通SCRM系统(4S店客户关系系统)的开发。系统原来是用Angular.js架构的,前后五个月,以每周至少四天加班的姿态,一个个接口请求,一个个功能模块,从老系统抠出来,再开发新的页面,我们像是种下一颗种子,每天灌溉施肥,今天,终于长出了果实,10.0版本终于上线了,更详尽介绍>>以下...原创 2019-07-12 14:26:47 · 202 阅读 · 0 评论 -
vue组件按需加载
最近,公司的 SCRM 系统开发临近收尾,在扫尾的时候,发现个别页面加载巨慢,甚至出现卡顿!起初还以为是公共组件的问题,但逐一排查,发现完全没有发现!组件明明做得像德芙一样,哪用都丝般柔滑嘛! 折腾半宿,才想起来,问题该是出在路由上。因为项目上线时间紧,是三人共同开发的,在页面开发前,其中一个同事已经把路由加好了,所谓加好了,是这么个样子:问题找到了,解决方案,也正是今天想...转载 2019-06-28 11:09:11 · 2769 阅读 · 0 评论 -
Js 判断空对象的几种方法
var obj = {};1、转化成 Json 字符串console.log(JSON.stringify(obj)==="{}");2、利用Es6遍历对象的属性:Object.keys(obj)console.log(Object.keys(obj).length===0);3、利用Es6遍历对象的属性:Object.getOwnPropertyNames(obj...原创 2018-11-20 17:49:57 · 578 阅读 · 0 评论 -
JS计算器
看别人写的js计算器,感觉功能不完善,自己写了一个!<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <title>计算器</title> <style> /*Basic原创 2018-07-27 10:07:04 · 258 阅读 · 0 评论 -
十种方法解决--- 1-100累加和
这是我去面试碰到的一道题,求 var num = [1,2,3,...,100] 的和,当初没细想,回过头来总结一下,综合网上的案例,有由如下10种方法:1、forvar sum1 = 0;for (var i = 0; i < num.length; i++) { sum1 += num[i];}console.log(sum1); //50502、for…i...原创 2018-07-27 10:40:42 · 4369 阅读 · 1 评论 -
JS 变量与变量提升
在我们平常写 JS 的时候,变量恐怕是出镜率最高的演员;不但出镜多,而且戏路广,生旦净末丑,都能切换自如;尤其当全局变量、局部变量、综合参数、函数声明等,这些戏精凑一块的时候,再来看变量,难免有像双兔傍地走, 难辨雄雌的感觉。 结合网上的一些范例,我写了如下的以一些测试,清楚变量的套路后,就只用配合她演出,不用在乎她设计那些情节了。1、变量与参数var a...原创 2018-07-27 11:16:13 · 930 阅读 · 1 评论 -
数组去重 - 创造 101 种方法(上)
在我们面试的过程中,数组去重,应该算翻牌率极高的题了,结合网上和自己的尝试,写了这个测试,整体涉及的知识点极广且曲径通幽。总结起来,有 101 种方法,999 朵玫瑰 1001 夜,哈哈,我自己都不信,要不我先写 11 种,接下的 90 种各种看官泼墨挥毫自由发挥!其实,倒也远不止11种方法,只是在下才疏学浅,只能抛砖引玉,暖暖场子。 你如果还有更棒的想法,欢迎留言开...原创 2018-08-01 18:09:18 · 201 阅读 · 0 评论 -
数组去重 - 创造 101 种方法(下)
接上篇 《数组去重 - 创造 101 种方法 (上)》6、mapvar arr =['大唐',1,3,2,5,9,"1",5,4,7,0,10,6,8,"大唐","盛世","6",null,undefined,false,true,"false"];function demo6(ary){ var res = []; ary.sort().map((current)=...原创 2018-08-02 14:58:21 · 331 阅读 · 0 评论 -
js & jQuery 绑定未来的元素
最近,一个同事跟我求助,说在页面点击按钮,向一个 div 添加 select 标签,根据 select 选中项取值,但取不到!如下:<button id="btn">btn</button> <div id="box"></div>怎么办?我们先来做几个测试: 1、点击 button,向 div 里添加多个未来按钮,点击某个未来按...原创 2018-08-16 00:55:11 · 1052 阅读 · 0 评论 -
js、jQuery 表单 - 那些事儿
1、select<select> <option value="1" selected="selected">北京</option> <option value="2">上海</option> <option value="3">深圳</原创 2018-08-09 18:29:43 · 134 阅读 · 0 评论 -
JS 绑定 - 刻舟求剑
来,玩个抽积木的游戏! 有如下:积木A、B、C,假设 A、B、C由下到上排列,随意分 3 次,抽出这3块积木(点击按钮,删除这个按钮本身 )<div id="test"> <button>积木A</button> <button>积木B</button> <button>积木C</button原创 2018-08-13 17:01:39 · 137 阅读 · 0 评论 -
Js this指向
this,这个!This is mine.这个是我的!This is yours. 这个是你的!世间万物,皆有所属!你的,我的,她的!哪怕失物,无人领取,也会归于公共名下!今天来聊聊 this,如果要用到JS,this 是避不开的话题,this之于JS ,像自拍之于女人,iPhone之于手机!来来来,正餐之前,先来一道开胃菜:function Fx(){ th...原创 2018-09-17 18:18:38 · 227 阅读 · 0 评论