- 博客(83)
- 问答 (1)
- 收藏
- 关注
原创 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
938
原创 Mac的yarn安装教程,解决zsh: command not found: yarn
【代码】Mac的yarn安装教程,解决zsh: command not found: yarn。
2023-04-27 17:50:33
549
原创 常用的JavaScript 知识点总结-数组
Array.from(arrayLike, mapFn, thisArg)不改变原来的类数组,返回一个真实数组返回一个真实数组1返回一个真实数组2类数组转化成真数组(可以转化Nodelist集合)Array.of创建一个具有可变数量参数的新数组copyWithin用于从数组的指定位置拷贝元素到数组的另一个指定位置中,改变原数组Array.find返回通过测试(函数内判断)的数组的第一个元素的值(非数组),不改变数组的原始值,如果没有符合条件的元素返回 undefinedArray.f
2023-03-23 17:40:14
1210
1
原创 前端权限点的封装优化
将权限点(变量)解藕,归纳到单独页面中管理;函数通过vuex解藕,能够独立调用,方便管理。// 财账 - 权限// 权限常量‘/api....’只出现一次,方便统一管理export const BACKEND_BEGINTOAUDITING = '/api.edu.admin.edu.v1.EduAdminEdu/BeginToAuditing' // 提交审核权限。
2023-02-27 16:11:54
340
原创 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
1113
原创 前端导出excel文件
注意:responseType应设置为:‘arraybuffer’,这样返回的文件流才会是二进制的,才能使用new Blob得到正确的文件。
2023-02-02 16:36:06
889
原创 vue3.x使用SvgIcon
在components文件夹下面创建svgIcon文件夹,里面包含SvgIcon.vue和index.ts。[注意:插件绑定了放置icon的文件路径]
2023-02-01 06:45:00
620
原创 Vue3.x+ElementUI+Axios+阿里云对象存储实现图片or文件上传
【代码】Vue3.x+ElementUI+Axios+阿里云对象存储实现图片or文件上传。
2023-01-31 18:35:34
455
原创 渲染函数render
它更准确的名字可能是 createNodeDescription,因为它所包含的信息会告诉 Vue 页面上需要渲染什么样的节点,包括及其子节点的描述信息。在vue脚手架的main.js文件中,render函数的作用是,将h创建的Node节点信息return返回给Vue.js底层处理文件中的beforeMount()生命周期钩子函数,让其将Node节点信息在界面中渲染出来。当浏览器读到这些代码时,它会建立一个“DOM 节点”树来保持追踪所有内容,如同你会画一张家谱树来追踪家庭成员的发展一样。
2023-01-30 19:10:32
1198
原创 函数式组件
标记组件为 functional:true,这意味它是无状态 (没有响应式数据),无实例 (没有 this 上下文,没有生命周期),为了弥补缺少的实例,提供第二个参数ctx作为函数式组件的上下文(Render 函数提供了第⼆个参数 context 来提供临时上下⽂)。// 父组件(使用组件)
2023-01-30 19:06:10
524
原创 git常见指令
将当前feature-cookies分支修改的文件全部提交到dev分支上?(当前分支 feature-cookies)将commit但是没有push的代码回退到工作区: git reset HEAD^从A分支转移到B分支。如果没有commit。
2023-01-06 14:20:26
108
原创 vue3.2的特性
定义:是Vue3推出的一个内置组件,它允许我们的程序在等待异步组件时渲染一些后备的内容,可以让我们创建一个平滑的用户体验;在vue3中,如果一个元素同时定义了v-bind="object"和一个相同的单独的属性,那么声明绑定的顺序决定了最后的结果(后者覆盖前者)在vue2.x中,如果一个元素同时定义了v-bind="object"和一个相同的单独的属性,那么这个单独的属性会覆盖object中的绑定。在vue2.x中,要求每个模板必须有一个根节点,在Vue3中我们可以直接不需要根节点。
2022-12-01 18:14:21
1350
原创 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
665
原创 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
1252
原创 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
2987
原创 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
768
原创 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
698
原创 关于promise的总结
关于promise的总结文章目录关于promise的总结promise是什么?promise解决了什么问题?如何创建一个promise对象?promise常用的API有哪些呢?promise的特点?手写一个promise使用手写的promise直接使用promise对象?promise是什么?promise从语法上来说是一个类,可以创建实例(new Promise)。promise是异步编程的一种解决方案。比传统的回调函数去解决异步要更合理。promise还是一个容器,里面保存着一个异步操作的最
2021-03-15 19:18:20
414
原创 Echarts图表鼠标hover到图形交点(拐点)时,改变symbol样式
举例1:散点图 { name: '用户', type: 'scatter', symbol: 'emptyCircle', symbolSize: 8, itemStyle: { // 线和拐点的颜色 color: '#0072FF', //图例的颜色
2020-10-30 16:01:16
6577
原创 [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
6225
原创 [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
4650
原创 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
576
原创 vue内置的组件transition(形成动画)
在官网中的详细描述:点击打开链接文章目录transition组件出现过度/动画效果的原因transition组件在什么情况下可以生成动画效果transition组件生成动画效果的方式1.CSS 过渡2.过渡可以和其他第三方 CSS 动画库连用3.CSS 动画4.还可以同时使用过渡和动画5.transition组件和JavaScript 钩子连用transition组件出现过度/动画效果的原因当插入或删除包含在 transition 组件中的元素时,Vue 将会做以下处理:自动嗅探目标元素是否应用了
2020-10-13 12:18:27
4267
原创 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
2169
原创 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
6544
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
1296
3
原创 音频延迟播放
需求:视频和音频分开播放,视频可以有可以无,音频至少一个,由于音频和视频有时差,需要依据视频进行校准。 seeking() { // 该函数是在播放、暂停、跳转进度条时,让音频对应播放、暂停、跳转 let currentTimeVideo = this.player.currentTime(); let audioDomList = document.getElementsByTagName("audio"); this.audioDiffrentTimeArray.
2020-08-07 17:44:57
1171
原创 区分浏览器的刷新和浏览器的关闭
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
780
原创 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
869
原创 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
3163
原创 将视频图片截图后,在前端压缩图片再上传
文章目录要点:方案:canvas绘制矩形的函数canvas绘制路径(轮廓)的函数添加样式和颜色绘制文本canvas操作视频完整案例要点:图片的大小由分辨率(长像素点*宽像素点)和位深度(由生成的图片是png/jpeg)决定(图像数据量大小=图像中的像素总数×图像深度 ÷ 8 ÷ 1024),图像深度决定图像能够显示的颜色种类。jpg是有损压缩格式,png是无损压缩格式。同一张图片,jpg的大小比png格式的大小小1.5倍。jpeg使用的一种失真压缩标准方法;PNG格式是无损数据压缩方法。canva
2020-06-30 10:29:41
698
原创 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
403
原创 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
382
原创 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
23525
13
使用canvas实现网页水印功能
2023-01-31
TA创建的收藏夹 TA关注的收藏夹
TA关注的人