![](https://img-blog.csdnimg.cn/20201014180756922.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
笔记
文章平均质量分 57
HerayChen
知识改变命运,学习成就未来。
展开
-
微信公众号h5页面缓存处理
h5公众号页面更新有缓存。原创 2023-03-17 12:14:47 · 2586 阅读 · 1 评论 -
Ant Design Vue select 展开页面滚动选项也跟着滚动
通过getPopupContainer改变浮层渲染父节点。通过开启浮层背景板解决。原创 2023-02-21 11:27:05 · 477 阅读 · 0 评论 -
antd radio-group选中时的浅蓝色外边框阴影去除
antd radio-group选中时的浅蓝色外边框阴影去除原创 2023-02-10 17:00:26 · 586 阅读 · 0 评论 -
修改alert的样式
在用Thymeleaf的时候通常会使用原生js来使用,为了页面更好看,我们需要调整原生内置组件的样式。原创 2023-02-07 16:15:02 · 1447 阅读 · 0 评论 -
uniapp使用及踩坑项目记录
在src下创建components文件夹,把创建的组件存放在components中,然后就可以全局使用了,不用导入,也不用注册,直接通过自定义组件文件名称来使用,vit会自动识别components中的文件为组件。由于vue3中不支持require,所以我就用自定义组件的方式, 通过利用image的error方法来实现了图片加载失败的占位效果。imgUrl : {也可以通过下面这种方式写,我是用自定义组件是因为调用接口的方法不支持内容的修改。原创 2023-01-28 14:41:57 · 6399 阅读 · 1 评论 -
前端加密与解密
常见的前端安全加密处理。原创 2022-11-18 17:50:32 · 5099 阅读 · 0 评论 -
WebStorm 支持微信小程序的 rpx 单位
webstorm在写微信小程序代码的时候,rpx单位会警告,并且格式化rpx单位与数值之间会有一个空格。原创 2022-11-08 10:26:49 · 1353 阅读 · 0 评论 -
鼠标滚轮滚动切换内容
利用常规动画库实现前端页面的动画。原创 2022-10-28 15:00:51 · 573 阅读 · 0 评论 -
eslint 警告处理合集
eslint禁止词法声明(let、const、function和class)出现在case或default子句中。,常出现在import文件的引用和变量的声明。在写兼容方法之前先写上标准属性。中的数据都有一个确定的返回值。解决方法删除报错位置的分号。,常出现在使用正则的时候。......原创 2022-07-21 17:42:43 · 7644 阅读 · 1 评论 -
nvm安装
简介nvm是用于nodejs版本管理的工具,可以根据项目需要切换对应的node版本。nvm下载链接安装前注意事项安装前请将本地的node卸载掉,不然会出现nvm node版本切换成功,但是项目中的node没有切换成功。下载对应版本的nvm建议下载1.1.7版本的安装:安装成功后通过管理员权限打开命令行窗口。查看是否安装成功:nvm -vnvm常用命令安装对应版本的node:nvm install 14.17.3(版本号)卸载对应版本的node:nvm原创 2022-04-25 15:23:09 · 352 阅读 · 0 评论 -
查询本地IP地址vue
Google:chrome://flags/#enable-webrtc-hide-local-ips-with-mdnsEdge:edge://flags/#enable-webrtc-hide-local-ips-with-mdnsgetIp() { if (typeof window != "undefined") { var RTCPeerConnection = window.RTCPeerConnection || wi.原创 2022-04-22 16:40:29 · 2520 阅读 · 0 评论 -
vue + echarts实现地图
全局安装echartsnpm i echarts --save将echarts绑定在原型上(main.js文件中)import * as echarts from 'echarts';Vue.prototype.$echarts = echarts;准备画布<template> <div ref="openingChart" style="height: 600px;"></div></template><script>.原创 2022-03-23 19:20:24 · 4077 阅读 · 5 评论 -
前端温故学习笔记
知识涵盖点HTML5 + CSS3 + JavaScript + JqueryNode + ES6Vue + ReactWebpack + MySqlRedisSVNGit小程序HTML5 + CSS3 + JavaScript + JqueryHTML5什么是网页网站时网页的集合。网页是网站中的一个“页”,通常是HTML格式的文件。网页是网站的基本元素,网页通俗的称为HTML文件。什么是HTML超文本标记语言,可以放文本、图片、音频等常用浏览器及内核内原创 2021-09-16 21:08:07 · 788 阅读 · 0 评论 -
wepy微信小程序 background-image的图片真机调试和体验版中无法加载
background-image背景图真机调试显示不出来原代码(背景图和image图片真机调试显示不出来):<view class="header" style="background-image: url( '../../../../static/images/home/homeHeaderBg.png')"> <image src="{{'../../../static/images/home/logo.svg'}}"/></view>修改后的代码:.原创 2021-08-13 15:12:37 · 543 阅读 · 0 评论 -
绝对定位后的元素无法触发点击事件
解决方法可以通过给绝对定位的层多加一个样式:" pointer-events:none; " 这样绝对定位层下的元素就可以点击了;如果在绝对定位层上存在能够点击的元素,在添加" pointer-events:none; " 后将同样不起作用;为了避免此情况,可以给需要操作的元素设置" pointer-events:auto" 即可。详情ionic试例:<ion-app> <ion-content fullscreen class="ion-padding-bottom"原创 2021-08-12 10:42:23 · 4003 阅读 · 3 评论 -
vue 拖动调整左右两侧容器大小
页面布局<template> <a-layout class="width-auto" id="product"> <div class="content"> <div id="left" class="left"> 左侧 </div> <div id="line" class="resize-line"><.原创 2021-07-31 17:45:23 · 2567 阅读 · 2 评论 -
svg代码转base64代码
转换页面上的svg代码svgBase64(): void { // 找到页面上面的svg元素 const svg = document.getElementById('svg'); // 将整个 document 对象序列化为一个 XML 字符串 const s = new XMLSerializer().serializeToString(svg); // 通过window.btoa() 方法用于创建一个 base-64 编码的字符串 con.原创 2021-07-29 19:37:34 · 14655 阅读 · 0 评论 -
No provider for InjectionToken NGX_ECHARTS_CONFIG echarts版本和ngx-echarts版本不兼容
core.js:6210 ERROR NullInjectorError: R3InjectorError(AnalysisModule)[InjectionToken NGX_ECHARTS_CONFIG -> InjectionToken NGX_ECHARTS_CONFIG -> InjectionToken NGX_ECHARTS_CONFIG -> InjectionToken NGX_ECHARTS_CONFIG]:NullInjectorError: No provider原创 2021-07-26 11:53:10 · 916 阅读 · 0 评论 -
NG-ZORRO-MOBILE 抽屉遮罩层点击关闭抽屉
https://ng.mobile.ant.design/#/components/drawer/zh框架自带的抽屉是没有遮罩层的,刚开始准备直接写在抽屉上面,但是遮罩层点击事件会冒泡。解决方法:自定义遮罩层html <ion-button size="small" (click)="openDrawer('line')"> <ion-icon class="icon navigation"></ion-icon></ion-button.原创 2021-07-08 10:37:10 · 720 阅读 · 0 评论 -
ngzorro 自定义指令操作 nz-table 列拖动缩放
创建指令ng g d drap-table-columnimport {AfterViewInit, Directive, ElementRef, Input} from '@angular/core';@Directive({ selector: '[appDrapTableColumn]'})export class DrapTableColumnDirective implements AfterViewInit { @Input('appDrapTableColum原创 2021-06-24 18:17:40 · 1159 阅读 · 3 评论 -
WeUI H5界面手机调试
Mac自带的本地服务器的使用 以及 手机访问打开终端,开启Apache:开启apache: sudo apachectl start重启apache: sudo apachectl restart关闭apache: sudo apachectl stop开启项目 在浏览器通过 ip地址 + 端口号访问通过 草料二维码 生成 二维码https://cli.im/通过手机扫描二维码就可以访问h5界面了,操作结束记得关闭apache。...原创 2021-06-22 10:14:02 · 261 阅读 · 0 评论 -
指定内容拖拽
Angular 拖拽功能之cdk-- drag-drop官网:https://material.angular.io/cdk/drag-drop/examplesimport { DragDropModule } from '@angular/cdk/drag-drop';@NgModule({ imports: [ DragDropModule ]})使用: <body class="example-boundary"> <!-- cdkDragBounda原创 2021-06-19 11:59:09 · 258 阅读 · 0 评论 -
vue-cli4引入element-ui报错
types.js?a742:39 Uncaught TypeError: Cannot read property 'prototype' of undefined at eval (types.js?a742:39) at Object../node_modules/element-ui/lib/utils/types.js (chunk-vendors.js:2736) at __webpack_require__ (app.js:849) at fn (app.js:.原创 2021-06-01 10:36:46 · 4432 阅读 · 0 评论 -
CKEditor5文本编辑器-angular使用
安装ckeditor项目依赖npm install --save @ckeditor/ckeditor5-angularnpm install --save @ckeditor/ckeditor5-build-classicnpm install --save @ckeditor/ckeditor5-ui根据实际情况配置封装ckeditor组件<ckeditor [editor]="Editor" [(ngModel)]="editorContent" [config]="config"原创 2021-05-29 15:36:28 · 1160 阅读 · 1 评论 -
echarts图表随屏幕自适应不变形
<div id="weekOnYear" style="width: 100%;height: 300px;" class="canvas-wrap"></div> import * as echarts from 'echarts'; drawWeekOnYear(weekOnYearStatistic: LineChartBean){ // 获取echarts操作的画布 let weekOnYear = echarts.init(documen..原创 2021-04-28 12:09:25 · 594 阅读 · 0 评论 -
桌面端打包及去除鼠标事件
打包命令 "postinstall": "electron-builder install-app-deps", "build-prod": "node --max_old_space_size=8000 ../../node_modules/@angular/cli/bin/ng run web:build:production --base-href ./", "build-desktop-prod": "npm run electron:serve-t原创 2021-04-26 19:47:13 · 254 阅读 · 0 评论 -
particles离子效果背景效果
通过js实现在js中写<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>particles Demo</title> <style class="cp-pen-styles"> /* #particles-js { position: absolute; .原创 2021-04-25 20:06:52 · 507 阅读 · 1 评论 -
echarts页面刷新后echarts图会变大
错误写法:100%继承了父元素的宽度,刷新值会改变正确写法:100vw是浏览器窗口的宽度,相当于一个固定值,浏览器刷新也不会改变原创 2021-04-20 17:14:26 · 2665 阅读 · 1 评论 -
Sass用法指南
什么是SassSASS是一种CSS的开发工具,提供了许多便利的写法,大大节省了设计者的时间,使得CSS的开发,变得简单和可维护。Sass的基本用法变量变量的简单使用$blue: #1875e7;div { /* 这样写就相当于 color: #1875e7; */ color : $blue;}变量的嵌套$side: left;div { /* 这样写就相当于 border-left-color: #1875e7; */ border-#{$side}-color :原创 2021-04-20 16:41:17 · 130 阅读 · 0 评论 -
JavaScript中的ReferenceError和TypeError
原创 2021-04-20 16:39:20 · 113 阅读 · 0 评论 -
VUE项目实战指南
电商后台管理系统前端项目技术栈vuevue-routerelement-uiaxiosecharts后端项目技术栈node.jsexpressjwxmysqlsequelize前端项目初始化步骤安装vue脚手架通过脚手架创建项目配置vue路由配置element-ui组件库配置axios库初始化git远程仓库将本地项目托管到GitHub或码云中...原创 2021-02-24 21:18:05 · 227 阅读 · 0 评论 -
微信小程序runtime.js和request.js
runtime.js/** * Copyright (c) 2014-present, Facebook, Inc. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */var regeneratorRuntime = (function (exports) { "use stric原创 2021-02-21 17:19:18 · 969 阅读 · 0 评论 -
前端各大框架的核心内容
———————————————Vue—————————————脚手架配置优化基础知识双向数据绑定(v-modal)template模板渲染语法和原理(vue-loader,虚拟DOM)指令和自定义指令methods computed watch filtersclass / style条件和循环渲染事件处理表单处理组件(属性)ref生命周期插槽transition渲染函数和jsx插件编写混入devtools…vue-router基础知识动态路由编原创 2021-02-14 10:57:48 · 184 阅读 · 0 评论 -
CSS经典布局
特点:左右固定,中间自适应圣杯布局html,body { height: 100%; overflow: hidden;}.container { height: 100%; padding: 0 200px;}.content,.left,.right { float: left;}.content { width: 100%; min-height: 500px; background: blue;}.l原创 2021-02-09 21:45:48 · 135 阅读 · 0 评论 -
React全家桶
React简介1. 是什么? 是将数据渲染为HTML视图的开源JavaScript库。2. 谁开发的? 是由Facebook开发,且开源。 起初由Facebook的软件工程师Jordan Walke创建。 于2011年部署于Facebook的newsfeed。 随后在2012年部署于Instagram。 2013年5月宣布开源。3. 为什么要学? 1. 原生的JavaScript操作DOM繁琐,效率低(`DOM-API操作UI`) 2原创 2021-02-08 11:25:40 · 873 阅读 · 1 评论 -
压缩svg图片(npm的svgo)
下载安装svgonpm install -g svgo通过 svgo 当前svg所在路径 -o 压缩后图片保存的路径svgo /Users/cly/Downloads/c.svg -o /Users/cly/Downloads/cc.svg原创 2021-02-04 16:58:12 · 1007 阅读 · 0 评论 -
ionic长按事件之hammerjs
在项目文件下下载安装hammerjsnpm i --save hammerjs2. 在项目的main.ts中,引入import 'hammerjs';在app.module.ts文件中注入HammerModuleimport {HammerModule} from '@angular/platform-browser';imports: [ HammerModule]在需要使用的界面通过press事件实现长按事件<ion-label class="messa.原创 2021-01-29 16:37:47 · 602 阅读 · 0 评论 -
使用hammerjs中的press长按事件后页面数据不能滚动
解决方法在长按事件上面加上触摸属性[style.touch-action]="'pan-y'",就可以了。<ion-label class="message no-bg" (press)="doPress()" [style.touch-action]="'pan-y'"> <img src="{{message.content}}" (click)="previewPic(message?.content)"/></ion-label>...原创 2021-01-19 17:07:52 · 495 阅读 · 1 评论 -
搜索查询内容高亮显示
实现原理循环编辑数据将数据改变一下,在高亮的内容上面加上含有样式的标签,去改变内容的展现形式实现查询数据的高亮// 查询聊天记录this.imService.getChatMessageByValue(value, this.accountCode , true).subscribe(result => { this.contacts = result; result.forEach( res => { res.accountName = re.原创 2021-01-19 15:26:58 · 1016 阅读 · 0 评论 -
js面试基础题
JS基础变量面试题1、JS使用typeof能得到哪些类型?考点: JS变量类型typeof undefined, //undefinedtypeof 'abc' ,//stringtypeof 123 ,//numbertypeof true ,//booleantypeof {} ,//objecttypeof [] ,//objecttypeof null ,//objecttypeof console.log ,//functiontypeof Symbol(1) // sy原创 2021-01-26 21:22:09 · 700 阅读 · 0 评论