自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(163)
  • 收藏
  • 关注

原创 项目打包提取公共模块

背景:项目加载第三方包过多,导致上线前构建速度过慢,于是进行将第三方包与项目代码进行分离。一、实时方案一,将第三方包单独构建为一个xx.js文件,在后续代码构建的时候,第三方构建包不参与打包过程,节省打包时间。1、新建 webpack.dll.conf.js ,进行单独打包配置,将下列库单独打包 1.1、 vue、vue-router、axios、element-ui、ag-gird、vue-axios、vue-quill-editor、echarts、vue-print-nb

2021-01-12 15:00:47 18

原创 canvas 绘制日历

/// index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> bo

2020-11-11 15:06:23 49

原创 js vue 根据城市名称 按A-Z进行排序展示

城市json文件引用地址:https://blog.csdn.net/u012339794/article/details/43483947window.CITYS = [ {"label": "北京Beijing010", "name": "北京", "pinyin": "Beijing", "zip": "010"}, {"label": "重庆Chongqing023", "name": "重庆", "pinyin": "Chongqing", "zip": "023"},

2020-07-10 15:12:37 641

原创 基于Vue、element ui 来进行第三方UI库开发、打包、发布,站点发布支持markmod语法

一、基于Vue、element ui 来进行第三方UI库开发、打包、发布,站点发布支持markmod语法二、目录结构介绍 . ├── build // 构建信息脚本 │ └── bin ├── dist // 前台API站点 │ ├── js │ └── static ├── example // 前台API站点源码 │ └── src ├── lib // 打包UI库文件 │ └── theme-chalk

2020-06-22 11:33:40 146 1

原创 vue 结合原生tabe 渲染表格 实现 固定头部、固定右侧、单选按钮、单元格拖拽监听位置

1.vue 结合原生tabe 渲染表格 实现 固定头部、固定右侧、单选按钮(避免el-table 数据量大卡顿)// table.vue<template> <div id="oldTable" v-if="headerData.length && tableData.length"> <div class="table-scroll-mod" :style="{height: height+ 'px'}">

2020-06-22 11:23:19 178

原创 storybook+Vue

storybook 实例功能介绍.storybook/webpack.config.js 可以用来重写 storybook 的默认配置相关插件介绍和使用1. knobs knobs插件提供一个表单控制台,用户可以通过表单控制台来改变组件相关属性,展示不同属性下的组件2.actions actions插件让用户在对组件的操作,可以反应在底部的日志里面3.storysource addon插件可以让你直接在界面上看到当前sotry的源码4.docs addon-d

2020-06-22 11:06:37 471

原创 express 测试浏览器缓存

// 测试Server端 express// Cache-Control 设置缓存const express = require('express');const fs = require('fs');const path = require('path');app.get('/*.css', function(req, res) { /** * @title 设...

2019-06-24 11:51:07 501

原创 Typescript注解

// test-descriptor.ts/** * 1.注解(装饰器)是一类特殊类型的声明,可以用在类、方法、构造器、属性和参数上。 * 2.其实本质上,定义一个注解,就是定义一个TypeScript方法,只是该方法必须符合官方的规范。 * 3.方法分别返回符合规范的函数闭包,参数target、propertyKey、descriptor。经测试,这三个参数中target和propert...

2019-06-21 11:21:21 5834

原创 typeScript interface和type区别

typeScript interface和type区别interface 参考资料 ----> https://www.tslang.cn/docs/handbook/interfaces.html// ts 自定义类型/** * Interface(接口) vs Type alias(类型别名) * 相同点-> 都可以描述一个对象或者函数 * ->...

2019-06-20 11:38:27 6023

原创 Typescript 记录

// 基础类型// 布尔值let isDonen: boolean = false;console.log('布尔值:', isDonen);// 数字类型let decLiteral: number = 6;console.log('数字类型:', decLiteral);// 字符串let nameStr: string = "bob";nameStr = "smith"...

2019-06-19 16:48:59 80

原创 Object.freeze和Object.seal

===============Object.freeze===============const freeObj = {name: 'zyn'}const freeObj1 = Object.freeze(freeObj)freeObj === freeObj1 // trueObject.isExtensible(freeObj1) // false 不可以被扩展Object.getO...

2019-06-19 16:24:17 188

原创 vue provide / inject

vue 使用 provide,inject。2.2.0 新增provide / inject 介绍provide 用法inject 用法实现 provide / inject 可监听provide / inject 介绍1. provide 和 inject 主要为高阶插件/组件库提供用例。并不推荐直接用于应用程序代码中。2. 这对选项需要一起使用,以允许一个祖先组件向其所有子孙后代注入一个...

2019-06-12 09:56:44 638

原创 windows安装MongoDB

windows安装MongoDB1.下载MongoDB 下载https://www.mongodb.com/download-center/community2. 进行自定义安装 C:/mongodb3. 创建自定义的db目录和log目录3.创建配置文件创建一个配置文件。该文件必须设置 systemLog.path 参数,包括一些附加的配置选项更好。例如,创建一个配置文件位于 C...

2019-05-24 11:47:34 36

原创 String和Buffer

一、JS语言自身只有字符串数据类型,没有二进制数据类型,因此NodeJS提供了一个与String对等的全局构造函数Buffer来提供对二进制数据的操作// 可以将文件的内容读取到Buffer实例,或者是直接构造Buffer实例。var hello = new Buffer([ 0x68, 0x65, 0x6c, 0x6c, 0x6f ]);// Buffer与字符串类似,除了可以用.leng...

2019-05-22 15:45:19 1147

原创 git 操作记录

一、git分支操作命令介绍git clone xxx克隆远程仓库代码git branch -a查看当前仓库的所有分支(包括本地分支和远程分支)git branch -r查看当前仓库的远程分支git branch -d branchName删除分支(不能再当前分支删除当前分支)git branch -D branchName强制删除分支(不能...

2019-05-17 14:58:47 277

原创 vue组件间通信($attrs, $listeners)

一、介绍 $listeners(自下而上传递数据), $attrs(自上而下多组件传递数据)在vue组件化开发过程中,涉及到多层组件嵌套,但如果仅仅是传递数据,而不做中间处理,使用Vuex层架复杂度这时候使用。代码参考地址:https://gitee.com/ligeyihayou/attrs-listeners二、设计文件结构// juejin.vue 路由组件入口// com-one...

2019-05-17 11:06:03 275

原创 js 自定义事件

<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maxi...

2019-05-15 11:03:06 518

原创 Vuecli3.0 借助DLLPlugin 和 DLLReferencePlugin 用某种方法实现了拆分 bundles,同时还大大提升了构建的速度。

DLLPlugin 和 DLLReferencePlugin Vuecli 3.0在vue项目,在打包的过程中将,常用的包进行提前打包,节省之后打包的时间。1.新增库打包文件webpack.dll.conf/** * Created by zyn on 2019/5/10. */const path = require('path');const webpack = require(...

2019-05-10 16:36:40 1756

原创 js自动检测是否使用new关键字创建函数

<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maxi...

2019-05-06 14:44:33 401

原创 正则表达式集合(持续添加)

const Regex = { Number: /^[0-9]+(.[0-9]+)?$/, //数字 PositiveInteger0: /^([1-9]\d*|[0]{1,1})$/, //正整数、0 PositiveInteger: /^([1-9]\d*)$/, //正整数 Money: /^[0-9]{1,9}(\.[0-9]...

2019-04-29 10:19:59 166

原创 js 为dom绑定事件发生了什么

一、js 为dom绑定事件发生了什么?DOM2级事件规定事件分为三个阶段事件捕获阶段事件捕获定义了事件首先由最外层的元素(window)接收,然后才是下级元素处于目标阶段捕获到当前绑定的dom元素事件冒泡阶段从当前捕获阶段线上冒泡到document元素addEventListener 可选参数介绍:capture: Boolean设置为tr...

2019-04-28 11:32:03 138

原创 简述:浏览器的缓存

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>浏览器的缓存</title></head><body><script> //// 浏览器的缓存 // 1. 如...

2019-04-26 17:59:45 65

原创 vue-cli 3.0 vue-cli-service.js解读

#!/usr/bin/env nodeconst semver = require('semver')const { error } = require('@vue/cli-shared-utils')const requiredVersion = require('../package.json').engines.nodeif (!semver.satisfies(process....

2019-04-26 17:51:25 755

原创 setTimeout模拟定时器,及清除该定时器

<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maxi...

2019-04-26 17:48:58 2055

原创 js 工具类方法记录

/** * Created by zyn on 2019/3/22. */const Utils = { getTime(dateTimeStr) { dateTimeStr = dateTimeStr.substring(0, 19); dateTimeStr = dateTimeStr.replace(/-/g, '/'); ret...

2019-04-26 17:36:40 53

原创 js继承优缺点详览

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...

2019-04-26 17:24:16 82

原创 Vue Cli 3.0 拆包配置

1.修改配置文件vue.config.jsconst feMockHandler = require('./vue.mock')const feLogHandler = require('./vue.log')const feProxy = require('./vue.config.proxy')// vue.config.js 配置说明module.exports = { ...

2019-04-26 17:15:09 2236

原创 Vuecli 3.0 项目自定义添加静态目录,支持在index.html引入

// Vuecli 3.0 项目自定义添加静态目录,支持在index.html引入 // 在VueCli3.0 以脚手架创建的项目中,public 中的文件不会被webpack进行打包,在npm run build 之后全部都会copy到 dist中 一、在src的同级别目录添加static(vuecli2.0) (mkdir static/js/c...

2019-04-24 13:49:30 9619

原创 Vue cli3.0 安装快速选择项介绍

// Vue cli3.0 安装快速选择项介绍 一、vue create myProject // 创建项目名称 TypeScript Progressive Web App (PWA) Support 支持渐进式网页应用程序 Router 路由管理器 ...

2019-04-23 10:10:00 349

原创 js 数组操作方法

<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maxi...

2019-04-18 14:49:09 41

原创 clipboard在Vue项目中点击两次可以进行复制,解决。

// 使用环境: Vue-cli3 复制剪切板插件:clipboard// 安装: npm install clipboard -save <p data-clipboard-action="copy" :id="'copy-'+ elindex" class="class-list-item__title" :data-clipboard-text="classInf...

2019-04-10 16:46:22 1720

原创 notification 组件

// element-ui// notification 组件// DOM 解析/** 1. transition 用来设置过度动画 2. customClass 传入自定义的类名 3. position 传入默认弹出的位置 4. horizontalClass 会根据 传入默认弹窗的位置 添加对应的 right left 类名 5. positionStyle 绑定Class 该...

2019-03-21 15:49:43 466

原创 v-text v-html {{}} 三者之间的区别

<template> <transition name="el-notification-fade"> <div :class="['el-notification', customClass, horizontalClass]" v-show="visible" :style="positionStyle" ...

2019-03-21 15:19:10 1189

原创 Vue $slots.default

// 子组件demo<template> <div> <slot></slot> <slot name="up"></slot> </div></template><script type="text/ecmascript-6"> ...

2019-03-20 14:31:00 5553

原创 js实现截取时间段进行倒计时和指定时间倒计时

&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;

2019-02-15 11:48:46 749 1

原创 浏览器缓存介绍

&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;浏览器的缓存&lt;/title&gt;&lt;/head&gt;&lt;body&gt;&lt;script&a

2018-10-12 10:34:50 84

原创 js秒杀倒计时

&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;&lt;/title&gt;&lt;/head&gt;&lt;body onload="miaosha();"&gt;&lt;p cl

2018-10-11 16:18:24 3525

原创 js 批量从缓存中读取数据

&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;Title&lt;/title&gt;&lt;/head&gt;&lt;body&gt;&lt;div id=&q

2018-10-11 16:14:58 1599

原创 Vue2.4.0 新增的inheritAttrs,attrs

/// Vue2.4.0 新增的inheritAttrs,attrs 1.适用于Vue中全套层数深的组件,从来从父组件向子组件传递数据(除style和class) 2.当一个组件没有声明任何prop时候,attrs里面包含着全部的上层组件传递的所有数据(除style和class) 3.当声明了prop时候,attrs里面包含除去prop里面的数据剩下的数据。 //// inher...

2018-10-08 10:00:00 460

原创 js继承详解

&amp;lt;!DOCTYPE html&amp;gt;&amp;lt;html lang=&quot;en&quot;&amp;gt;&amp;lt;head&amp;gt; &amp;lt;meta charset=&quot;UTF-8&quot;&amp;gt; &amp;lt;meta name=&quot;viewport&quot; conten

2018-09-29 17:23:22 946

空空如也

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人 TA的粉丝

提示
确定要删除当前文章?
取消 删除