- 博客(83)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 npm not found和zsh: command not found: npm
nvm install 版本号，这个是node 14.21.2出错，重新安装，或者卸载后安装。npm not found和zsh: command not found: npm。
2023-12-04 18:19:11
723
原创 Mac的yarn安装教程，解决zsh: command not found: yarn
【代码】Mac的yarn安装教程，解决zsh: command not found: yarn。
2023-04-27 17:50:33
359
1
原创 常用的JavaScript 知识点总结-数组
Array.from(arrayLike, mapFn, thisArg)不改变原来的类数组，返回一个真实数组返回一个真实数组1返回一个真实数组2类数组转化成真数组（可以转化Nodelist集合）Array.of创建一个具有可变数量参数的新数组copyWithin用于从数组的指定位置拷贝元素到数组的另一个指定位置中，改变原数组Array.find返回通过测试（函数内判断）的数组的第一个元素的值(非数组)，不改变数组的原始值,如果没有符合条件的元素返回 undefinedArray.f
2023-03-23 17:40:14
550
1
原创 前端权限点的封装优化
将权限点（变量）解藕，归纳到单独页面中管理；函数通过vuex解藕，能够独立调用，方便管理。// 财账 - 权限// 权限常量‘/api....’只出现一次，方便统一管理export const BACKEND_BEGINTOAUDITING = '/api.edu.admin.edu.v1.EduAdminEdu/BeginToAuditing' // 提交审核权限。
2023-02-27 16:11:54
221
原创 Vue 的实用开发技巧
因此相比于 v-if 不断删除和创建函数新的 DOM，v-show 仅仅是在更新现有 DOM 的显隐值，所以 v-show 的开销要比 v-if 小的多，当其内部 DOM 结构越复杂，性能的差异就会越大。但是 v-show 相比于 v-if 的性能优势是在组件的更新阶段，如果仅仅是在初始化阶段，v-if 性能还要高于 v-show，原因是在于它仅仅会渲染一个分支，而 v-show 把两个分支都渲染了，通过 style.display 来控制对应 DOM 的显隐。
2023-02-17 09:45:00
876
原创 前端导出excel文件
注意：responseType应设置为：‘arraybuffer’，这样返回的文件流才会是二进制的，才能使用new Blob得到正确的文件。
2023-02-02 16:36:06
519
原创 vue3.x使用SvgIcon
在components文件夹下面创建svgIcon文件夹，里面包含SvgIcon.vue和index.ts。[注意：插件绑定了放置icon的文件路径]
2023-02-01 06:45:00
371
原创 Vue3.x+ElementUI+Axios+阿里云对象存储实现图片or文件上传
【代码】Vue3.x+ElementUI+Axios+阿里云对象存储实现图片or文件上传。
2023-01-31 18:35:34
339
原创 渲染函数render
它更准确的名字可能是 createNodeDescription，因为它所包含的信息会告诉 Vue 页面上需要渲染什么样的节点，包括及其子节点的描述信息。在vue脚手架的main.js文件中，render函数的作用是，将h创建的Node节点信息return返回给Vue.js底层处理文件中的beforeMount()生命周期钩子函数，让其将Node节点信息在界面中渲染出来。当浏览器读到这些代码时，它会建立一个“DOM 节点”树来保持追踪所有内容，如同你会画一张家谱树来追踪家庭成员的发展一样。
2023-01-30 19:10:32
929
原创 函数式组件
标记组件为 functional：true，这意味它是无状态 (没有响应式数据)，无实例 (没有 this 上下文，没有生命周期)，为了弥补缺少的实例，提供第二个参数ctx作为函数式组件的上下文（Render 函数提供了第⼆个参数 context 来提供临时上下⽂）。// 父组件（使用组件）
2023-01-30 19:06:10
313
原创 git常见指令
将当前feature-cookies分支修改的文件全部提交到dev分支上？（当前分支 feature-cookies）将commit但是没有push的代码回退到工作区: git reset HEAD^从A分支转移到B分支。如果没有commit。
2023-01-06 14:20:26
60
原创 vue3.2的特性
定义：是Vue3推出的一个内置组件，它允许我们的程序在等待异步组件时渲染一些后备的内容，可以让我们创建一个平滑的用户体验；在vue3中，如果一个元素同时定义了v-bind="object"和一个相同的单独的属性，那么声明绑定的顺序决定了最后的结果（后者覆盖前者）在vue2.x中，如果一个元素同时定义了v-bind="object"和一个相同的单独的属性，那么这个单独的属性会覆盖object中的绑定。在vue2.x中，要求每个模板必须有一个根节点，在Vue3中我们可以直接不需要根节点。
2022-12-01 18:14:21
649
原创 echarts 设置主标题title
文章目录最终效果js代码最终效果js代码 option() { const title = this.chartData.source ? `{title| ${this.chartData.title}}{source| ${this.chartData.source} }` : `{title| ${this.chartData.title}}` return{ title: { text: title,
2021-12-06 17:15:39
545
原创 vue中动态渲染元素或者标签(不通过v-if,不影响子元素)
需求：在变量isHaveForm为true时，元素标签渲染，为false时，只渲染中的子元素，如果直接用v-if控制达不到要求。vue中动态渲染元素或者标签需求转换成：删除元素，而不删除其子元素自定义指令实现// html 代码 <el-form ref="listQuery" v-el-remove-myself-html="isHaveForm" :model="listQuery" :inline="true"> <el
2021-09-03 18:40:04
1108
原创 element ui 表单动态验证，验证规则或触发方式不生效
文章目录1.需求2.完整有效的代码3.代码线上运行链接4.表单验证触发生效的重点1.需求Element UI 里的表单是通过v-for循环渲染出来的，某些表单组件验证的required必填的属性是动态响应的。如图，当选择框不是全部时，输入框必填。2.完整有效的代码// html <el-form :model="dynamicValidateForm" ref="dynamicValidateForm" label-width="100px" class="demo-dynamic"&g
2021-09-03 15:07:24
2582
原创 Vue+ElementUI+Axios+腾讯云对象存储实现图片/文件上传
文章目录1.需求：将文件上传至腾讯云私有数据库2.上传至腾讯云3.从腾讯云上下载文件4.参考1.需求：将文件上传至腾讯云私有数据库步骤：安装腾讯云sdk(现在是cos-js-sdk-v5)获取临时身份凭证token,该token被设置为1小时有效拿到临时身份凭证后上传文件将上传后的文件id或者url(看后端需要什么数据)传给后端，在数据库中保存由于是私有库，需要对显示的文件在下载的时候去获取真正的文件地址（如果是共有库，这一步省略）2.上传至腾讯云// html 代码 &l
2021-08-31 18:14:56
607
原创 js 将数字格式化成金额，并保留两位小数
代码 const number = Math.ceil(balance * 100) / 100; // 向上取两位小数 money = new Intl.NumberFormat('en-GB', { style: 'currency', currency: 'CNY' }).format(number); money = money.replace('CN', ' ');例子知识点Intl.NumberFormat...
2021-07-16 16:37:40
593
原创 关于promise的总结
关于promise的总结文章目录关于promise的总结promise是什么？promise解决了什么问题？如何创建一个promise对象？promise常用的API有哪些呢？promise的特点？手写一个promise使用手写的promise直接使用promise对象？promise是什么？promise从语法上来说是一个类，可以创建实例（new Promise）。promise是异步编程的一种解决方案。比传统的回调函数去解决异步要更合理。promise还是一个容器，里面保存着一个异步操作的最
2021-03-15 19:18:20
244
原创 Echarts图表鼠标hover到图形交点（拐点）时，改变symbol样式
举例1：散点图 { name: '用户', type: 'scatter', symbol: 'emptyCircle', symbolSize: 8, itemStyle: { // 线和拐点的颜色 color: '#0072FF', //图例的颜色
2020-10-30 16:01:16
5695
原创 [Vue warn]: Error in mounted hook: “TypeError: Cannot read property ‘get
描述：多坐标轴，报错。解决：有几个x轴写几个y轴。 yAxis: [ { show: false, type: 'value', }, { gridIndex: 1, show: false, type: 'value', },
2020-10-28 17:25:43
6128
原创 [Vue warn]: Error in mounted hook: “TypeError: Cannot read property ‘coordinateSystem‘ of undefined“
描述：在绘制多个图表，而不是一个的时候遇到此问题。解决：// 有几个坐标轴就写几个grid。 grid: [ { left: '0', right: 0, top: 10, }, // 写一模一样的会重叠 { left: '0', right: 0, top: 10 }, ],..
2020-10-28 17:19:36
4522
原创 vue动画组件transition
文章目录动画组件transition一、出现过度/动画效果的原因？二、什么情况下可以生成动画效果？三、生成动画效果的方式3.1 CSS 过渡3.2 和第三方 CSS 动画库连用3.3 CSS 动画3.4 同时使用过渡和动画3.5 transition和JS 钩子连用3.6 组件间切换的动态效果实现3.7 元素间切换的动态效果实现3.8 可复用过渡组件四、参考动画组件transition一、出现过度/动画效果的原因？当插入或删除包含在 transition组件中的元素时，Vue 将会做以下处理：1
2020-10-15 14:22:46
524
原创 vue内置的组件transition（形成动画）
在官网中的详细描述：点击打开链接文章目录transition组件出现过度/动画效果的原因transition组件在什么情况下可以生成动画效果transition组件生成动画效果的方式1.CSS 过渡2.过渡可以和其他第三方 CSS 动画库连用3.CSS 动画4.还可以同时使用过渡和动画5.transition组件和JavaScript 钩子连用transition组件出现过度/动画效果的原因当插入或删除包含在 transition 组件中的元素时，Vue 将会做以下处理：自动嗅探目标元素是否应用了
2020-10-13 12:18:27
3883
原创 react定义函数，默认函数参数的方式
参数是：对象有传入参数用传入参数作为入参数，无传入参数用默认值 getTableData = async (pageData = {}) => { const params = Object.assign({}, { currPage: 1, pageSize: this.state.pageSize }, this.state.searchData, pageData); ... // 浅拷贝，当pageData是非空对象，会把{ currPage: 1, pageSize:
2020-09-25 10:44:52
1971
原创 echarts-for-react中数据发生变化，如何让图表实时更新
需求：点击按钮，图表的数据改变// 1.用ref得到dom，ref不用引入 return ( <ReactEcharts ref={(e) => { this.echartsElement = e }} option={this.getChartOption()} style={{ height: '500px' }} onEvents={onEvents} notMerge={true} /> </div
2020-09-22 10:16:14
5614
1
原创 angular中代替setTimeout的方案
1.引入 import { time } from ‘rxjs’2.timer(500) // 相当于setTimeout，500ms后执行3.timer(参数1，参数2) // 相当于 setInterval，参数1 ms后执行一次,然后每参数2 ms后再执行一次timer(500) .subscribe(()=>{if（）{// 需要执行的代码}})...
2020-08-11 17:57:14
1206
3
原创 音频延迟播放
需求：视频和音频分开播放，视频可以有可以无，音频至少一个，由于音频和视频有时差，需要依据视频进行校准。 seeking() { // 该函数是在播放、暂停、跳转进度条时，让音频对应播放、暂停、跳转 let currentTimeVideo = this.player.currentTime(); let audioDomList = document.getElementsByTagName("audio"); this.audioDiffrentTimeArray.
2020-08-07 17:44:57
1048
原创 区分浏览器的刷新和浏览器的关闭
1.在 mounted中，加入回调函数 window.addEventListener("unload", (e) => this.unloadHandler(e)); window.addEventListener("load", (e) => this.loadHandler(e));2.定义函数 unloadHandler(e) { // 判断是刷新还是关闭网站 let unloadDate = new Date().getTime() + "";
2020-07-23 16:24:10
672
原创 Preflight request for request with keepalive specified is currently not supported
报错描述：VM8044 polyfills.js:3366 Preflight request for request with keepalive specified is currently not supportedfetch(uri, { method: 'POST', headers: { 'Content-type': options.headers.get('content-type'), 'Authorization': options.headers.get('
2020-07-22 17:37:05
715
原创 network看不到请求发送出的url信息
有可能是基础路径少写了http例如：正确：const domain = 'http://192.168.16.228:9999';错误：const domain = '192.168.16.228:9999'; 没有http://，无法进行http请求，无法在network上看到url信息。
2020-07-07 11:30:11
3063
原创 将视频图片截图后，在前端压缩图片再上传
文章目录要点：方案：canvas绘制矩形的函数canvas绘制路径(轮廓)的函数添加样式和颜色绘制文本canvas操作视频完整案例要点：图片的大小由分辨率（长像素点*宽像素点）和位深度（由生成的图片是png/jpeg）决定（图像数据量大小=图像中的像素总数×图像深度 ÷ 8 ÷ 1024），图像深度决定图像能够显示的颜色种类。jpg是有损压缩格式，png是无损压缩格式。同一张图片，jpg的大小比png格式的大小小1.5倍。jpeg使用的一种失真压缩标准方法;PNG格式是无损数据压缩方法。canva
2020-06-30 10:29:41
560
原创 vue 项目将编辑框输入的html带样式下载成文档
文章目录1.需求：2.代码1.需求：利用markdown插件，将生成的html带样式保存成文档2.代码 // 获取编辑框的 html handleSave(): void { const renderContent = (this.$refs.editor as any).d_render // 处理得到的<html> 标签 const htmlElement = document.createElement('html') htmlEleme
2020-06-04 13:44:35
302
原创 Property d_render does not exist on type Element | Element[] | Vue | Vue[]
(this.$refs.editor as any).d_render // ts语法把当前(this.$refs.editor）对象转换成任意类型的意思。
2020-06-04 09:33:38
304
原创 Problems loading reference : Unable to load schema from : Unable to connect......
文章目录现象描述解决：在settings.json中添加，最后重启项目现象描述Problems loading reference ‘https://schemastore.azurewebsites.net/schemas/json/package.json’: Unable to load schema from ‘https://schemastore.azurewebsites.net/schemas/json/package.json’: Unable to connect to https
2020-06-03 10:19:11
22872
13
使用canvas实现网页水印功能
2023-01-31
TA创建的收藏夹 TA关注的收藏夹
TA关注的人