不一般的菜瓜-CSDN博客

JavaScript 简介JavaScript 简介JavaScript 简史JavaScript 实现1.ECMAScript2.文档对象模型（DOM）3. 浏览器对象模型（BOM）总结：JavaScript 简介JavaScript 简史JavaScript 名字的由来：布兰登·艾奇计划在1995年2月发布的Netscape Navigator 2 开发LiveScript 的脚本语言——该语言将同时在浏览器和服务器中使用。后来Netscape在与Sun合作之后将其改名为JavaScript。J

2022-02-07 14:03:13 879

原创后端给图片加水印的方法

/**public static MultipartFile addWorkMarkToMutipartFile(MultipartFile multipartFile,String time , String address) throws IOException { // 获取图片文件名 xxx.png xxx String originFileName = multipartFile.getOriginalFilename(); // 获取原图片后缀 png int

2021-10-28 13:46:12 1007

原创 Element-UI的table合并span-method

objectSpanMethod({ row, column, rowIndex, columnIndex }) { const span = column['property'] + '-span' console.log(span) if (row[span]) { console.log(row[span]); return row[span] } }, mergeTableRow(data, merg.

2021-10-11 13:56:49 347

原创 NProgress进度条简单使用

安装npmnpm install --save nprogressYarnyarn add nprogress直接引入js、css或者通过cdn引入<script src='nprogress.js'></script><link rel='stylesheet' href='nprogress.css'/>使用方法方法调用start和done// 使用方法NProgress.start(); — 显示进度条NProgress

2021-08-13 14:41:32 1753

原创 element-UI的级联远程动态加载数据回显

需求：省市区使用element-UI的级联组件实现省市区的动态加载选择以及数据的回显// template <el-cascader :key="cascader" ref="cascader" :placeholder="请选择省市区" @change="changeAdress" style="width: 100%" v-model="provinces" :props="props" :options="province"

2021-08-11 15:46:52 1979

原创 Element-UI的table使用tab页切换行展示行错位问题修复

Element-UI的table使用tag页切换行展示行错位问题修复项目中的场景：菜单内使用el-tabs组件然后分为汇总和详情两个tab，两个独自请求列表展示正常，当点击其他菜单再进行切回的时候详情tab页的序号和其他行展示错误解决：首先table是封装的组件，在封装组件中对组件中没有处理activated activated() { this.$refs.table && this.$refs.table.doLayout() }其次在写tabs 的

2021-07-05 17:02:28 2084

原创 vue-cli@3.0的vue.config.js最基本配置

const path = require('path')module.exports = { // 基本路径 publicPath: process.env.NODE_ENV === 'production' ? '' : '/', // 输出文件目录 outputDir: process.env.NODE_ENV === 'production' ? 'dist' : 'devdist', // eslint-loader 是否在保存的时候检查 lintOnSav

2021-05-10 15:56:22 143

原创 Babel常用的插件

Babel常用的插件1. @babel-plugin-dynamic-import-node作用：在开发环境下解决vue热加载编译速度慢的问题。2. @babel/plugin-syntax-dynamic-import作用：懒加载引入动态文件。3. @babel/plugin-proposal-object-rest-spread作用：插件会将类中的属性编译参数 loose4. @babel-plugin-transform-vue-jsx作用: Vue中的渲染函数可以支持JSX语法1. @babel-

2021-05-10 15:53:00 2256

原创 npm运行项目报错----Cannot find module ‘@babel/compat-data/corejs3-shipped-proposals‘

启动项目运行 npm run serve时候报错 Cannot find module ‘@babel/compat-data/corejs3-shipped-proposals‘解决办法一： npm update --depth 5 @babel/compat-data解决方法二： package.json中devDependencies对象添加 “@babel/compat-data”: “7.9.0”...

2021-04-07 13:27:00 633

原创 Generator 函数的含义与用法

Generator 函数的含义与用法Generator 函数的含义与用法什么是异步？回调函数Promise协程Generator函数Generator函数的数据交换和错误处理Generator函数的用法Generator 函数的含义与用法异步编程对js语言非常重要，如果没有异步，js执行到setTimeout或者很大数据量返回的时候都会造成程序阻塞。异步编程的四种方法： - 回调函数 - 事件监听 - 发布/订阅 - Promise对象ES6将异步编程带入一个全新的阶段，异步编程的对法目标

2021-03-16 16:30:04 275

原创面试题_js_Call，Apply，Bind的使用与区别，如何实现一个bind？

Call，Apply，Bind的使用与区别，如何实现一个bind?Call，Apply，Bind的使用与区别实现一个bindCall，Apply，Bind的使用与区别相同点:都是使用与方法借用以及明确this指向场景第一个参数都是this要指向的对象都可以利用后面参数进行传参不同点参数传递方式不同call apply是立即调用 bind是动态调用基本使用Array.prototype.slice.call(obj,0,1,2)Array.prototype.s

2021-03-15 14:28:11 116

原创生成包括大小写字母数字以及符号的密码且不能有连续或者倒叙以及其校验

一：生成随机密码生成随机密码// 随机生成密码方法 function randomPassword(min: number, max: number) { let str = "" let arr = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k", "l", "m", "n", "o", "p", "q"

2021-03-02 16:26:32 755

原创数组扁平化

数组扁平化数据扁平化方法方法一：js原生的flat方法二：replace方法方法三：递归处理方法四：reduce方法五：扩展运算符数据扁平化方法需求：多维数组 => 一维数组let ary = [1,[2,[3,[4,5]]],6]方法一：js原生的flat// 根据js原生的flat方法let ary = [1,[2,[3,[4,5]]],6]let newAry = ary.flat(Infinity) // Arrayflat(depth) 参数是原始数组深度也可以写In

2021-03-01 16:41:54 107

原创富文本quill.js使用

富文本Quill.js背景使用封装组件完整代码富文本Quill.js背景项目中使用vue-quill-editor 不能兼容table所以重新使用了quill.js使用引入Editor: () => import("@/components/editor/Editor")template<editor :id="dialogFrom[item.prop] + '--only'" v-model="dialogFrom[item.prop]" :pro.

2021-01-07 15:10:35 870

原创富文本vue-quill-editor配合element-ui的自定义图片上传

富文本vue-quill-editor配合element-ui的自定义图片上传完整代码富文本vue-quill-editor配合element-ui的自定义图片上传完整代码// QuillEditor.vue<template> /* 外层包裹组件*/ <div class="quill-wrap" :id="id"> /* 1. 给upload标记唯一标识id 2. :action="severUrl" 服务器地址*/ <el-upload .

2021-01-07 14:52:37 163

原创富文本vue-quill-editor扩展图片上传服务器：quill-image-extend-module

富文本扩展 quill-image-extend-modulenpm安装组件引入更新配置富文本扩展 quill-image-extend-modulenpm安装npm install quill-image-extend-module --save-dev组件引入 import {quillEditor, Quill} from 'vue-quill-editor' import {container, ImageExtend} from 'quill-image-extend-modu.

2021-01-07 14:37:16 643

原创富文本vue-quill-editor扩展支持图片拖拽和放大缩小

富文本vue-quill-editor扩展支持上传图片vue-quill-editor扩展支持上传图片并拖拽以及放大缩小图片拖拽以及放大缩小vue-quill-editor扩展支持上传图片并拖拽以及放大缩小图片拖拽以及放大缩小基本功能的基础上支持图片的拖拽放大和缩小更便于富文本中对图片进行操作。需要配合插件进行使用。npm 安装插件npm i quill-image-drop-module -S // 拖拽插件npm i quill-image-resize-module -S // 放大

2021-01-07 11:34:19 1901 5

原创富文本vue-quill-editor封装组件以及基本使用

vue-quill-editorvue-quill-editor背景简介使用vue-quill-editor背景选择理由：后台管理系统项目中需要使用富文本，用于web端展示一些协议或者文本加图片的复杂文本，所以使用富文本进行对复杂文本进行配置更好。富文本插件有很多，想选择一个简单的富文本且应用得项目是vue项目，所以选择了vue-quill-editor。简介基于 Quill,适用于Vue的富文本编辑器,支持服务端渲染和单页应用.不过有一定的兼容性,就是兼容IE10+使用npm安装依赖

2021-01-07 10:52:01 1553

原创 Cookie详解以及Cookie操作

CookieCookie详解什么是Cookie?Cookie的工作机制是怎样的？Cookie的组成Cookie的使用Cookie的局限Cookie详解什么是Cookie?cookie 的作用就是用于解决如何记录客户端的用户信息HTTP协议本身是无状态的。无状态即为服务器无法判断用户身份，cookie 的作用就是用于解决如何记录客户端的用户信息。Cookie是存储在客户端简单文本文件（key-value格式）。客户端向服务端发起请求，服务端会为每个访问的客户端产生一个唯一的ID，然后以Cookie文

2020-12-16 19:49:48 711

原创 Element属性学习之clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTop

Element属性学习之clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTopElement属性学习之clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTopclientHeight和offsetHeight属性和元素的滚动、位置没有关系它代表元素的高度。clientHeightoffsetHeightscrollHeightscrollTopoffsetTopElement属性学习之

2020-12-09 15:12:58 1330

空空如也

空空如也