- 博客(41)
- 收藏
- 关注
RSS订阅原创 中国地图3D立体效果
中国地图3D立体效果具体思路：geo叠加3层，zlevel是重叠的优先级<template> <div class="map"> <div class="charts" ref="chartsBox"></div> <div class="e-label"> <p class="e-label-title">项目图例</p> <p>区域公司<img src
2022-05-06 10:55:05
2785
原创 Vue项目时间过滤器
Vue项目时间过滤器//获取上月年月export function getLastMonth(val) { var timeStamp = val ? new Date(val) : new Date(), year, month; year = timeStamp.getFullYear() month = timeStamp.getMonth() + 1 month = month == 1 ? 12 : month - 1 //上月数据 month ==
2022-05-06 10:48:37
570
原创 Vue代理配置
Vue代理配置在vue.config.js里添加module.exports = { publicPath: '/', outputDir: 'dist', assetsDir: 'static', lintOnSave: false, productionSourceMap: false, devServer: { port: port, // open: true, hot: true, proxy: { "/jx": {
2022-05-06 10:47:55
411
原创 中国地图3D立体效果
中国地图3D立体效果具体思路：geo叠加3层，zlevel是重叠的优先级<div class="map"> <div class="charts" ref="chartsBox"></div> <div class="e-label"> <p class="e-label-title">项目图例</p> <p>区域公司<img src="../../../assets/i
2022-05-06 10:46:03
2495
原创 边框四边包角样式
边框四边包角样式.border-wrap { position: relative; height: 100%; padding: 5px;}.border_corner { position: absolute; background: rgba(0, 0, 0, 0); border: 3px solid #00FAFF;}.border_corner_left_top { width: var(--width); height: var(--height
2022-05-06 10:39:24
249
原创 vue使用wavesurfer.js
vue使用wavesurfer.js安装wavesurfernpm install wavesurfer.js页面中引入import WaveSurfer from 'wavesurfer.js'import Timeline from 'wavesurfer.js/dist/plugin/wavesurfer.timeline.js'Html<div class="waveform-wrapper"> <div id="waveform" ref="wavef
2022-05-06 10:32:58
1391
原创 Element UI 分页选择保留之前选中的数据
Element UI 分页选择保留之前选中的数据<el-table :data="alarmTable" style="width: 100%" ref="multipleTable" :row-key="getRowKeys" @selection-change="handleSelectionChange"> <el-table-column type="selection" width="55" :reserve-selection="true"> &
2022-05-06 10:32:03
822
原创 前端JSON转excel下载
前端JSON转excel下载方法一 let jsonData = [{ id: "1", grade: "大二", }, { id: "1", grade: "大二", name: "Mike" }]; var str = 'Id,年纪,姓名\n'; for (let i = 0; i < jsonD
2022-05-06 10:30:59
472
原创 Vue项目代理+baseURL的设置
Vue项目代理+baseURL的设置Vue.config.js里module.exports = { devServer: { host: 'localhost',//target host port: 8080, //proxy:{'/api':{}},代理器中设置/api,项目中请求路径为/api的替换为target proxy: { '/api': { target: 'http://10.191.4.1
2022-05-06 10:30:10
5137
原创 浏览器下载文件代码
浏览器下载文件代码this.$axios .get( this.$baseUrlsNew + 'xibei/monthlyanalysis/export?dataDate=' + this.search.dataDate, { responseType: 'blob' }, { responseHeaders: { 'Access-Control-Expose-Headers':
2022-05-06 10:28:06
723
原创 Vue-cli3在IE浏览器下页面空白
Vue-cli3在IE浏览器下页面空白安装babel-polyfillnpm install babel-polyfillmain.jsimport 'babel-polyfill'babel.config.jsmodule.exports = { presets: [ ['@vue/app', { 'useBuiltIns': 'entry' }] ]}vue.config.js chainWebpack(config) { /
2021-06-11 10:07:50
454
1
原创 图片上传裁剪和压缩功能—vue-cropper
图片上传裁剪和压缩功能—vue-cropper安装npm install vue-cropper -S使用main.js文件里面import VueCropper from 'vue-cropper'Vue.use(VueCropper)在组件内用import { VueCropper } from 'vue-cropper' components: { VueCropper,},具体参数说明<template> <div class="croppe
2021-06-08 14:23:39
619
原创 Angular4+组件间传值
Angular4+组件间传值1. 组件间通信父组件传值给子组件：父组件：<app-index [title]="title" [run]="run"></app-index>子组件：import { Input } from '@angular/core';@Input() title;@Input() run;//这样就可以直接使用{{title}},...
2020-01-16 13:57:05
578
原创 angular4 报错记录
###angular4 报错记录1.Can’t bind to ‘routerLink’ since it isn’t a known property of ‘a’…解决办法：在模块中引入RouterModuleimport { Routes, RouterModule } from '@angular/router';const routes: Routes = [];@NgModu...
2019-03-27 14:50:40
628
原创 淘宝npm镜像
淘宝npm镜像当我们在项目中npm install 太慢时，可以使用淘宝镜像来提高npm的速度；淘宝npm 地址： http://npm.taobao.org/1.临时使用npm --registry https://registry.npm.taobao.org install express12.持久使用npm config set registry https://regist...
2019-03-27 14:42:32
347
1
原创 阻止表单回车默认提交事件
阻止表单回车默认提交事件onkeydown='if(event.keyCode==13) return false;'<form nz-form [formGroup]="validateForm" onkeydown='if(event.keyCode==13) return false;'> </form>提交按钮加disabled<...
2019-03-07 17:47:52
1511
原创 表单常用正则验证
表单常用正则验证1.去除空格 //去除空格 nameValidator(c: FormControl) { let NOT_NULL = /\s{0,}[\S]{1,}[\s\S]{0,}/; if (c.value) { if (!NOT_NULL.test(c.value)) { return { error: true, notnull:...
2019-03-07 17:47:26
328
原创 CSS3 背景
CSS3 背景背景图片背景颜色属性：background-color取值：合法的颜色值 或 transparent注意：默认情况下，背景（颜色、图像）是从边框位置处就开始填充背景图片属性：background-image取值：url(图像的URL) “xxx"/ ‘xxx’ /xxx背景平铺属性：background-repeat取值：repeat：水平...
2019-03-07 17:46:37
258
原创 css之选择器
css之选择器1.兄弟选择器 1.相邻兄弟选择器 相邻：与 某元素 紧紧挨在一起的元素 作用：匹配 下一个相邻元素（只能向下找不能向上找） 语法： + 作为结合符 selector1+selector2 <div> <p></p> <h1 class="head" id="myH1"></h1&am
2019-03-07 17:46:13
310
原创 交换两变量值
交换两变量值var a=10;var b=20;1.使用第三方变量var t;t=a;a=b;b=t2.方法二a+=b;b=a-b;a-=b;a ^= b;b ^= a;a ^= b;4.方法四a={a:b,b:a};a=a.a;b=a.b;5.方法五a=[a,b];b=a[0];a=a[1];6.方法六a=[b,b=a] [0];7.方法七（ES...
2019-03-07 17:40:06
252
原创 内置对象
内置对象String Number Boolean ——包装类型Array Date Math RegExpErrorFunction ObjectGlobal（全局对象）在浏览器中被window代替String多个字符组成的只读数组vs 数组 相同：下标 .length for遍历 slice() 不同： 两者类型不同，API 不同API: 所有St...
2019-03-07 17:31:07
350
原创 倒计时算法
倒计时算法var s=parseInt((endDate-sysDate)/1000);var day=parseInt(s/(3600*24));var hour=parseInt(s%(3600*24)/3600);var minute=parseInt(s%3600/60);var second=s%60var s=parseInt((endDate-sysDate)/1000...
2019-03-07 17:25:19
1433
原创 JavaScript运算符优先级
JavaScript运算符优先级运算符描述. [] ()字段访问、数组下标、函数调用以及表达式分组++ – - ~ ！ delete new typeof void一元运算符、返回数据类型、对象创建、未定义值* / %乘法、除法、取模+ - +加法、减法、字符串连接<< >> >>...
2019-03-07 17:24:43
340
原创 正则表达式
正则表达式：Regular Expression描述一个字符串中字符出现规律的规则语法：一个固定的关键词原文，也是一种最简单的规则字符集：规定一个字符上可用的备选字符列表何时：只要一位字符有多个备选字 [备选字列表]简写：如果备选字符列表连续，可用-省略中间字符[0-9] 一位数字[a-z] 一位小写字母[A-Z] 一位大写字母[A-Za-z] 一位字...
2019-03-07 17:23:30
209
原创 angular4 项目设置端口号
angular4 项目设置端口号一般项目默认的端口号是4201.angular-cli.json文件中： "defaults": { "styleExt": "scss", "component": {}, "serve": { "po
2019-01-17 14:41:24
911
原创 几种angular常用自定义的管道
几种angular常用自定义的管道根据日期判断星期import { Pipe, PipeTransform } from '@angular/core';@Pipe({ name: 'formatDay'})export class FormatDayPipe implements PipeTransform { transform(value: any, format...
2019-01-08 16:54:48
500
原创 HTML属性绑定
#####HTML属性绑定: 1.基本Html属性绑定 &amp;lt;td [attr.colspan]=&quot;tableColspan&quot;&amp;gt;Something&amp;lt;td&amp;gt; 2.CSS类属性绑定&amp;lt;div class=&quot;aaa bbb&quot; [class]=&
2018-12-26 17:11:48
980
原创 解决异步加载window.open 被拦截
解决异步加载window.open 被拦截原因：在chrome的安全机制里面，非用户粗发的window.open方法，是会被拦截的当发送完ajax之后window.open就会被拦截；原因是用户没有直接发出window.open，而是发出一个ajax请。求，会被浏览器误认为是什么垃圾广告之类的拦截；解决方法：1.把打开窗口的操作写在onclick事件中$('#btn').click(fu...
2018-12-25 17:34:39
797
原创 修改浏览器select默认样式
修改浏览器select默认样式 <div class="select"> <select name="brower"> <option value="one">新东方培训网站</option> <option value="two" select
2018-12-24 18:10:28
887
原创 angular4相同路由间的页面跳转
相同路由间的页面跳转，页面不刷新的问题例：切换单位之后路由仍为/home，但不同组织的首页配置不同(包括banner,公告等等)，如果直接跳转/home的话，页面不会进行刷新而且参数(id)也不会发生任何变化；方法一： this.router.navigate(['home',{id:value}]); //后面带个参数，页面就会刷新此时，页面刷新了，有些原始数据已经渲染上去，...
2018-12-14 15:10:09
1464
原创 转换文字方式
转换文字方式方法1： getCourseType(value) { let texts = { 'ONLINE': '在线', 'OFFLINE': '面授' }; return texts[value] || ''; }方法2： // 判断图标 returnIcon(value) { switch (value) { case 'pdf'...
2018-10-30 15:38:13
291
原创 如何自学一门语言
如何自学一门语言了解背景知识：历史、现状、特点、应用领域、发展趋势搭建开发环境，编写HelloWorld声明变量和常量数据类型运算符逻辑结构通用小程序函数和对象第三方库、组件、框架、实用项目...
2018-10-30 15:37:30
518
原创 清除浮动
清除浮动方法一：.clearfix:after { visibility: hidden; display: block; content: " "; clear: both; height: 0;}方法二： .parent { overflow: hidden; }方法三： <div class="parent"&g...
2018-10-30 15:36:38
163
原创 css之常用样式
常用的css样式[class*="col-"]:选择所有类名中含有”col-“的元素[class^="col-"]:选择所有类名中以”col-“开头的元素[class$="-col"]:选择所有类名中以”-col”结尾的元素:after和:before的作用及使用方法1.:before 和 :after 的主要作用是在元素内容前后加上指定内容html:&am
2018-07-25 14:50:21
1221
原创 angular4学习笔记(基础篇)
第二章学习笔记Angular程序架构组件:是Angular应用的基本构建块，你可以把一个组件理解为一段带有业务逻辑和数据的html模块:模块用来将应用中不同的部分组织成一个Angular框架可以理解的单元服务:用来封装可重用的业务逻辑指令:允许你向html元素添加自定义行为环境搭建第三章 使用Angular Route路由路由基础：路由传参：...
2018-07-25 14:31:13
613
原创 深克隆和浅克隆的区别
深克隆和浅克隆的区别js变量包含两种不同数据类型的值：基本类型和引用类型基本类型都是按值访问的，我们可以直接操作保存在变量中实际的值引用类型(array、object)访问的是保存字变量对象中的一个地址，因此出现了深克隆和浅克隆深克隆和浅克隆的区别浅克隆(shallow copy):新旧对象共享一个地址，改变一个，另一个也会改变深克隆(deep copy):新旧对象不共...
2018-06-08 15:07:04
3433
原创 .angular-cli.json常见配置说明
.angular-cli.json常见配置说明{ &quot;$schema&quot;: &quot;./node_modules/@angular/cli/lib/config/schema.json&quot;, &quot;project&quot;: { &quot;name&quot;: &quot;soft-h&
2018-05-30 19:51:10
1685
原创 angular4项目搭建总结
项目搭建步骤1：设置开发环境首先安装Node.js和npm,安装地址（在终端/控制台窗口中运行命令&amp;amp;amp;nbsp;node -v&amp;amp;amp;nbsp;和&amp;amp;amp;nbsp;npm -v查看版本 ）然后全局安装 Angular CLI。npm install -g @angular/cli步骤2：创建新项目ng new SoftH步骤3：启动项目cd Sof
2018-05-29 11:43:59
1520
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人