自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 中国地图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 2461

原创 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 483

原创 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 363

原创 中国地图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 2108

原创 边框四边包角样式

边框四边包角样式.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 178

原创 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 1251

原创 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 707

原创 前端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 400

原创 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 4873

原创 浏览器下载文件代码

浏览器下载文件代码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 648

原创 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 364 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 472

原创 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 535

原创 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 527

原创 淘宝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 296 1

原创 阻止表单回车默认提交事件

阻止表单回车默认提交事件onkeydown='if(event.keyCode==13) return false;'&lt;form nz-form [formGroup]="validateForm" onkeydown='if(event.keyCode==13) return false;'&gt; &lt;/form&gt;提交按钮加disabled&lt;...

2019-03-07 17:47:52 1446

原创 表单常用正则验证

表单常用正则验证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 283

原创 CSS3 背景

CSS3 背景背景图片背景颜色属性:background-color取值:合法的颜色值 或 transparent注意:默认情况下,背景(颜色、图像)是从边框位置处就开始填充背景图片属性:background-image取值:url(图像的URL) “xxx"/ ‘xxx’ /xxx背景平铺属性:background-repeat取值:repeat:水平...

2019-03-07 17:46:37 200

原创 css之选择器

css之选择器1.兄弟选择器​ 1.相邻兄弟选择器 相邻:与 某元素 紧紧挨在一起的元素​ 作用:匹配 下一个相邻元素(只能向下找不能向上找)​ 语法: + 作为结合符 selector1+selector2 &lt;div&gt; &lt;p&gt;&lt;/p&gt; &lt;h1 class="head" id="myH1"&gt;&lt;/h1&am

2019-03-07 17:46:13 237

原创 交换两变量值

交换两变量值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 203

原创 内置对象

内置对象String Number Boolean ——包装类型Array Date Math RegExpErrorFunction ObjectGlobal(全局对象)在浏览器中被window代替String多个字符组成的只读数组vs 数组 相同:下标 .length for遍历 slice()​ 不同: 两者类型不同,API 不同API: 所有St...

2019-03-07 17:31:07 322

原创 倒计时算法

倒计时算法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 1362

原创 JavaScript运算符优先级

JavaScript运算符优先级运算符描述. [] ()字段访问、数组下标、函数调用以及表达式分组++ – - ~ ! delete new typeof void一元运算符、返回数据类型、对象创建、未定义值* / %乘法、除法、取模+ - +加法、减法、字符串连接&lt;&lt; &gt;&gt; &gt;&gt;...

2019-03-07 17:24:43 306

原创 正则表达式

正则表达式:Regular Expression描述一个字符串中字符出现规律的规则语法:一个固定的关键词原文,也是一种最简单的规则字符集:规定一个字符上可用的备选字符列表何时:只要一位字符有多个备选字 [备选字列表]简写:如果备选字符列表连续,可用-省略中间字符[0-9] 一位数字[a-z] 一位小写字母[A-Z] 一位大写字母[A-Za-z] 一位字...

2019-03-07 17:23:30 167

原创 angular4 项目设置端口号

angular4 项目设置端口号一般项目默认的端口号是4201.angular-cli.json文件中: &quot;defaults&quot;: { &quot;styleExt&quot;: &quot;scss&quot;, &quot;component&quot;: {}, &quot;serve&quot;: { &quot;po

2019-01-17 14:41:24 857

原创 几种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 457

原创 HTML属性绑定

#####HTML属性绑定:​ 1.基本Html属性绑定 &amp;amp;lt;td [attr.colspan]=&amp;quot;tableColspan&amp;quot;&amp;amp;gt;Something&amp;amp;lt;td&amp;amp;gt;​ 2.CSS类属性绑定&amp;amp;lt;div class=&amp;quot;aaa bbb&amp;quot; [class]=&amp

2018-12-26 17:11:48 918

原创 解决异步加载window.open 被拦截

解决异步加载window.open 被拦截原因:在chrome的安全机制里面,非用户粗发的window.open方法,是会被拦截的当发送完ajax之后window.open就会被拦截;原因是用户没有直接发出window.open,而是发出一个ajax请。求,会被浏览器误认为是什么垃圾广告之类的拦截;解决方法:1.把打开窗口的操作写在onclick事件中$('#btn').click(fu...

2018-12-25 17:34:39 708

原创 修改浏览器select默认样式

修改浏览器select默认样式 &lt;div class="select"&gt; &lt;select name="brower"&gt; &lt;option value="one"&gt;新东方培训网站&lt;/option&gt; &lt;option value="two" select

2018-12-24 18:10:28 806

原创 angular4相同路由间的页面跳转

相同路由间的页面跳转,页面不刷新的问题例:切换单位之后路由仍为/home,但不同组织的首页配置不同(包括banner,公告等等),如果直接跳转/home的话,页面不会进行刷新而且参数(id)也不会发生任何变化;方法一: this.router.navigate(['home',{id:value}]); //后面带个参数,页面就会刷新此时,页面刷新了,有些原始数据已经渲染上去,...

2018-12-14 15:10:09 1416

原创 瀑布流的两种实现方式

瀑布流的两种实现方式1.采用绝对定位的方式也可以用浮动瀑布流—js(查看代码)2.纯Css的方式瀑布流—css(查看代码)

2018-10-30 15:39:13 558

原创 转换文字方式

转换文字方式方法1: getCourseType(value) { let texts = { 'ONLINE': '在线', 'OFFLINE': '面授' }; return texts[value] || ''; }方法2: // 判断图标 returnIcon(value) { switch (value) { case 'pdf'...

2018-10-30 15:38:13 250

原创 如何自学一门语言

如何自学一门语言了解背景知识:历史、现状、特点、应用领域、发展趋势搭建开发环境,编写HelloWorld声明变量和常量数据类型运算符逻辑结构通用小程序函数和对象第三方库、组件、框架、实用项目...

2018-10-30 15:37:30 473

原创 清除浮动

清除浮动方法一:.clearfix:after { visibility: hidden; display: block; content: " "; clear: both; height: 0;}方法二: .parent { overflow: hidden; }方法三: &lt;div class="parent"&g...

2018-10-30 15:36:38 129

原创 css之常用样式

常用的css样式[class*=&quot;col-&quot;]:选择所有类名中含有”col-“的元素[class^=&quot;col-&quot;]:选择所有类名中以”col-“开头的元素[class$=&quot;-col&quot;]:选择所有类名中以”-col”结尾的元素:after和:before的作用及使用方法1.:before 和 :after 的主要作用是在元素内容前后加上指定内容html:&am

2018-07-25 14:50:21 1143

原创 angular4学习笔记(基础篇)

第二章学习笔记Angular程序架构组件:是Angular应用的基本构建块,你可以把一个组件理解为一段带有业务逻辑和数据的html模块:模块用来将应用中不同的部分组织成一个Angular框架可以理解的单元服务:用来封装可重用的业务逻辑指令:允许你向html元素添加自定义行为环境搭建第三章 使用Angular Route路由路由基础:路由传参:...

2018-07-25 14:31:13 562

原创 深克隆和浅克隆的区别

深克隆和浅克隆的区别js变量包含两种不同数据类型的值:基本类型和引用类型基本类型都是按值访问的,我们可以直接操作保存在变量中实际的值引用类型(array、object)访问的是保存字变量对象中的一个地址,因此出现了深克隆和浅克隆深克隆和浅克隆的区别浅克隆(shallow copy):新旧对象共享一个地址,改变一个,另一个也会改变深克隆(deep copy):新旧对象不共...

2018-06-08 15:07:04 3351

原创 vs code常用扩展安装

vs code常用扩展安装

2018-05-31 11:12:59 1000

原创 .angular-cli.json常见配置说明

.angular-cli.json常见配置说明{ &amp;quot;$schema&amp;quot;: &amp;quot;./node_modules/@angular/cli/lib/config/schema.json&amp;quot;, &amp;quot;project&amp;quot;: { &amp;quot;name&amp;quot;: &amp;quot;soft-h&

2018-05-30 19:51:10 1615

原创 angular4项目搭建总结

项目搭建步骤1:设置开发环境首先安装Node.js和npm,安装地址(在终端/控制台窗口中运行命令&amp;amp;amp;amp;nbsp;node -v&amp;amp;amp;amp;nbsp;和&amp;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 1449

空空如也

空空如也

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

TA关注的人

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