前端
文章平均质量分 62
普通网友
这个作者很懒,什么都没留下…
展开
-
uni-app开发小程序 使用@escookrequest-miniprogram配置网络请求
1.因为小程序中无法使用axios,而wx.request功能过于简单,所以下载加强版网络请求包:npm init -y 在项目根目录初始化package.json文件npm i @escook/request-miniprogram -S 下载网络请求包2.打开main.js入口文件import { $http } from '@escook/request-miniprogram'//从网络请求包中引入$http请求对象uni.$http = $http//因为在其他的页面或组件中也原创 2022-03-12 13:16:13 · 697 阅读 · 1 评论 -
vue+flv.js+SpringBoot+websocket实现视频监控与回放
vue+flv.js+SpringBoot+websocket实现视频监控与回放需求:vue+springboot的项目,需要在页面展示出海康的硬盘录像机连接的摄像头的实时监控画面以及回放功能.之前项目里是纯前端实现视频监控和回放功能.但是有局限性.就是ip地址必须固定.新的需求里设备ip不固定.所以必须换一种思路.通过设备的主动注册,让设备去主动连接服务器后端通过socket推流给前端实现实时监控和回放功能;思路:1:初始化设备.后端项目启动时就调用初始化方法.2:开启socket连接.前原创 2022-03-11 20:10:41 · 1446 阅读 · 1 评论 -
Uncaught TypeError Cannot read properties of undefined (reading ‘style‘)解决办法
1、下面为出现问题的代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &l原创 2022-03-11 18:47:38 · 9801 阅读 · 1 评论 -
Node.js详细安装教程(2021)
Node.js详细安装教程1.下载安装官网下载链接:添加链接描述下载红线可以避免配置麻烦打开下载的可更改路径,也可默认不用勾选,直接next输入node -v接着npm -v安装完成。2.修改全局模块路径和缓存路径(可选,大家自行选择是否修改)当我们在执行npm install express -g命令时,g表示global全局。会默认下载到c盘,c盘一般作为系统盘,尽量把一些程序安装到其他盘,来减少c盘空间的占用它的默认路径为:【C:Use.原创 2022-03-11 14:47:00 · 1404 阅读 · 0 评论 -
element-plus Icon 图标全局使用方法,可供菜单图标使用
封装组件<template> <el-icon :size="size" :color="color"> <component :is="name"></component> </el-icon></template><script>import { ref, defineComponent } from "vue";import * as Icons from "@element-plus/ic原创 2022-03-11 12:03:20 · 773 阅读 · 0 评论 -
关于Element-plus按需引入的一些坑-1
在使用vite之后element-plus按需引入用了插件unplugin-vue-components,其中有些问题记录一下。在使用Elmessage等写在js文件中的反馈提示消息的组件消息时插件识别不到css文件,就会出现如下效果这时就需要在main.ts中手动引入你所需要的css文件如import 'element-plus/theme-chalk/el-message.css如果图省事把css文件全部引入就是这样import 'element-plus/dist/index.css'原创 2022-03-09 13:55:10 · 348 阅读 · 0 评论 -
Vue实现在线编辑excel
目录luckysheet1.插件引入2.声明excel在线预览编辑组件3.excelJs分解Dom为excel文件流luckysheet文档地址exceljs文档地址前言介绍:原先平台没有要求在线编辑excel功能,excel文件是表单新增记录展现表格信息的一条记录信息,用于展示excel文件名称,支持下载功能,后续可能是客户嫌弃文件下载网速过慢,所以要求支持在线预览和编辑功能。项目周会讨论时提到这个需求,我当时的第一反应是这个功能前端来做的话,从18年开始网上生态情况,开源插件很少,原创 2022-03-09 11:11:23 · 2414 阅读 · 0 评论 -
vue3+ts+vite+pinia 项目搭建
1. 起始,项目搭建yarn 创建项目yarn create vitepnpm 安装依赖(如果没有可以用npm)// mac安装pnpmsudo npm i -g yarn// 安装依赖pnpm i//启动项目yarn dev//安装一下pretter和eslintpnpm i prettier eslint eslint-config-prettier eslint-plugin-prettier eslint-plugin-vue vue-eslint-parser @types原创 2022-03-09 09:50:25 · 531 阅读 · 1 评论 -
vite2.1 最新alias别名设置方式
vite.config.js 别名配置resolve.alias类型:Record<string, string> | Array<{ find: string | RegExp, replacement: string }>将会被传递到@rollup/plugin-alias作为entries的选项。也可以是一个对象,或一个{ find, replacement }的数组.当使用文件系统路径的别名时,请始终使用绝对路径。相对路径的别名值会被原封不动地使用,因此无法被正常原创 2022-03-09 08:15:42 · 235 阅读 · 0 评论 -
REGEXP_REPLACE的使用方法
regexp_replace的使用非常灵活,且容易忘记,故做此笔记。没有过多的介绍使用说明,只是根据个人理解列出很多相似案例,个人觉得通过对比,更容易理解几个参数的使用技巧。所有案例均是实跑出来的结果。带颜色的部分是需要留意的地方。命令格式:regexp_replace(source, pattern, replace_string, occurrence)参数说明:● source: string类型,要替换的原始字符串。● pattern: string类型常量,要匹配的正则模式,pat原创 2022-03-08 13:35:23 · 1843 阅读 · 0 评论 -
nodeinternalmodulescjsloader936错误的解决办法
错误如下原因,npm 安装包有误,少了一部分模块,我当时是去nodejs官网下载了相应版本的压缩包zip 然后解压出来把新的文件代替我之前缺少模块的文件。这个方法可以解决问题哦注意一个要点安装一个包的时候一定要一步一步先初始化再进行安装一般项目是先 npm init 初始化,然后在 npm i -S 要安装的包 。...原创 2022-03-08 12:15:00 · 516 阅读 · 0 评论 -
javascript百炼成仙 第一章 掌握JavaScript基础 1.2直接量
叶小凡的住处被安排在青山院西北角的一个房间里,虽不宽敞,倒也干净。叶小凡两眼露出振奋的眼神,随便吃了点乡亲们准备的干粮后,就立刻开始打坐修行。编程之修,重在积累,而非资质。资质虽然一样重要,可是后天的努力一样必不可少。这些道理,叶小凡还未上山之前,就已经熟知!因此,即便是资质平凡,只要肯下苦功,一样可以修得正果!叶小凡虽然甲等资质,可依然不骄不躁,开始从“JavaScript基础修炼要诀”第一页开始看起。修炼要诀第一章,直接量。编程世界,所谓直接量,就是明面上可以见到的数据值。常见的直接量有数字,小数原创 2022-03-08 10:54:43 · 94 阅读 · 0 评论 -
axios的使用与封装
什么是axiosAxios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中。特性从浏览器中创建 XMLHttpRequests从 node.js 创建 http 请求支持 Promise API拦截请求和响应转换请求数据和响应数据取消请求自动转换 JSON 数据客户端支持防御 XSRF浏览器支持绝大部分现代浏览器以及ie8+axios使用安装使用npmnpm install axios使用cdn案例axios(confi原创 2022-03-08 08:14:26 · 334 阅读 · 0 评论 -
解决Cannot read property ‘tapAsync‘ of undefined 问题过程
前两天从公司git 上clone了一个前端项目采用Nodejs + React 写的,想本地跑起来试试看,自己倒腾倒腾,结果在尝试的过程中遇到各种问题,真是一路上过关斩将终于跑起来了,其中有个典型的问题,因为是初次接触这个问题困扰了我几天,具体错误如下:Module build failed (from ./node_modules/_mini-css-extract-plugin@0.7.0@mini-css-extract-plugin/dist/loader.js):TypeError: Cann原创 2022-03-07 09:36:57 · 3499 阅读 · 0 评论 -
手把手教你vue3引入vue-router路由
首先我们建一个文件夹 叫vue项目目录然后用编辑器打开这个文件夹 在终端输入 : vue create catin创建一个vue项目然后我们用编辑器打开新生成的目录 vue项目目录下的catin在终端中输入 : vue add vue-next 将vue2升级成vue3项目在终端中输入 : npm install vue-router@4 引入路由插件注意后面的@4很重要 这是在声明安装的版本 当然 以后可能会有5 6等等 版本自然是越高越好 但我们这个功能 4就可以了然后在src目录下建原创 2022-03-07 08:13:33 · 4412 阅读 · 2 评论 -
Web前端-JS基础
Web前端-JSJS的历史和特点简介JS诞生的背景JS的历史JS的特点JS的语法基础第一个JS例子JavaScript 语法JavaScript 输出基本语句JavaScript 数据类型的转换javaScript方法javaScript函数js中的函数定义匿名函数定义JS对象数组对象字符串对象JS面向对象编程javaScript选择器javaScript弹框确认框对话框JS的历史和特点简介JS诞生的背景1原创 2022-03-06 02:02:38 · 566 阅读 · 0 评论 -
vue3之fix [Vue warn] Write operation failed computed value is readonly
<template> <div class="transparency tool-kit" @click.stop> <section class="contain"> <span>透明度</span> <a-slider v-model:value="slideVal" :tooltipVisible="false" @change="changeSlider" /> <span&原创 2022-03-06 00:41:16 · 1864 阅读 · 0 评论 -
JavaScript闭包 - 面试重灾区,如何应对?
1.闭包-面试重灾区最近面试的过程中,但凡问到JavaScript闭包的时候,一脸懵逼的情况的占多数。闭包这个东西,你说它重要吧,确实很重要,毕竟这是很多前端框架广泛使用的开发技巧。你说他不重要吧,也确实没那么重要,因为我们开发项目基本都是套用现有的框架,在框架的范围里面写代码,很少会用到闭包。可是,耐不住面试经常要问啊。这一节,我们就来聊聊闭包的话题!2.什么情况会产生闭包先看一个例子:function f(){ let a = 1; return function(){原创 2022-03-05 20:28:05 · 77 阅读 · 0 评论 -
vite2.1 最新alias别名设置方式
vite.config.js 别名配置resolve.alias类型:Record<string, string> | Array<{ find: string | RegExp, replacement: string }>将会被传递到@rollup/plugin-alias作为entries的选项。也可以是一个对象,或一个{ find, replacement }的数组.当使用文件系统路径的别名时,请始终使用绝对路径。相对路径的别名值会被原封不动地使用,因此无法被正常原创 2022-03-03 22:54:46 · 224 阅读 · 0 评论 -
swagger2 配置访问路径_swagger2---程序猿的便捷神器
这个框架有什么好处,为什么要学它?1、为前端提供接口数据。在前后端分类的项目中,前后端数据同步问题一直是一个头疼的问题,导致前后端人员经常意见不合,撕b甚至大打出手提供接口数据2、实时更新文档。在我们增加一个字段或者改变某些信息的时候总是没有实时更新文档的习惯,导致后期维护造成很大的困扰,占用不必要的工作时间。可以清楚看到各个接口及意义,后端改,实时同步3、可以在线测试。这个功能相当于postman,可以自己模拟参数,然后测试。输入具体的参数后,点击Execute运行测试Swagger2原创 2022-03-03 17:21:31 · 17297 阅读 · 1 评论 -
npm install报错:This version of npm is compatible with lockfileVersion@1, but package-lock.json was ge
npm install报错:This version of npm is compatible with lockfileVersion@1, but package-lock.json was generated for lockfileVersion@2. I’ll try to do my best with it!下依赖的时候提示这个,但是仍然可以继续下依赖,但下的过程中,有的提示报错了,因为已经将解决了,报错的截图找不到了。解决办法:当前电脑安装的npm是lockfileVersion@1的原创 2022-03-03 16:16:44 · 9888 阅读 · 0 评论 -
error ‘defineProps‘ is not defined no-undef
error ‘defineProps’ is not defined no-undef例如defineProps和defineEmits生成no-undef警告示例.eslintrc.js:module.exports = { env: { 'vue/setup-compiler-macros': true }}安装上面的配置完成之后就可以了大家也可以去官网查看vue3 no-undefhttps://eslint.vuejs.org/user-guide/#faq原创 2022-03-03 14:07:43 · 1492 阅读 · 0 评论 -
B站---【狂神说Java】JavaWeb入门到实战---笔记
该笔记大部分搬运B站遇见狂神说的javaWeb,顺便把图文合并记录,便于回顾视频地址:https://www.bilibili.com/video/BV12J411M7Sj 记得三连文章目录1、基本概念1.1、前言1.2、web应用程序web应用程序:1.3、静态web1.4、 动态web2、web服务器2.1、技术讲解2.2、web服务器3、Tomcat3.1安装tomcat tomcat3.2、Tomcat启动和配置3.3、配置3.4、发布一个we原创 2022-03-03 12:16:18 · 1625 阅读 · 0 评论 -
依赖服务故障怎么办?几百万的项目明天要路演Demo了
依赖服务故障怎么办?几百万的项目明天要路演Demo了场景有时候创业者会开发制作一些项目,比如一些App,去创业园区找大佬展示。可事不遂人意,App依赖的一些服务出现故障,首屏(首页怎么也登录不进去)。本来是进入App下单提交结果卡在支付弹窗,进不到下一步,demo肯定没法顺利进行了。这下可完犊子了,几千万的融资难道就要飞了!其实这个问题跟:对方服务下线,手上的开发还没有做完,怎么继续进行,是一样的!下面开始讲解,围绕一个App调用第三方支付服务来讲,请静心阅读。 文末还有博主准备的编程专栏原创 2022-03-02 12:50:22 · 127 阅读 · 0 评论 -
用jQuery实现轮播图效果(自动播放,能手动切换)
大家好,今天我和大家分享一下轮播图的实现,下面是我做的轮播图效果首先我们看到,它是由背景图片、方向图标和指示器组成。**我们发现背景图片、方向图标和指示器是层叠在一起的,所以布局时我们要用绝对定位。**我们要实现点击方向图标时,图片跟着变换;点击指示器时,图片跟着变换;不点击时每隔5秒自动播放;不点击时不显示方向图标。**结构布局:**用一个div包裹3个div,里面的3个div分别显示背景图片部分、方向图标部分和指示器部分。<!DOCTYPE html><html lang="原创 2022-03-02 03:54:15 · 5044 阅读 · 0 评论 -
如此优秀的JS轮播图,写完老师都沉默了
雷迪森安的乡亲们,欢迎来到老实人的前端课堂,今天我们来写个骚气磅礴的轮播图吧,内容太干,建议收藏起来慢慢看,最后我还会教大家如何免费部署上线哦~正片小轮播图滑动滚播,好不好看你说了算。结构就两行<div id="main"> <h1>something</h1> <div class="content"> <p>You can press <kbd>▲</kbd> <kbd&原创 2022-03-02 02:50:41 · 138 阅读 · 0 评论 -
Web前端:HTML最强总结 附详细代码
Web前端基础:Web前端:HTML最强总结 附详细代码Web前端:CSS最强总结 附详细代码Web前端:JavaScript最强总结 附详细代码Web前端工具:Web前端: JQuery最强总结(附上详细代码)Web前端:Bootstrap最强总结 附详细代码HTML最强总结 附详细代码常见工具下载基本结构常用标签文本标签段落标签换行标签水平线标签范围标签图片标签列表标签定义描述标签标签分类超链接页面间的跳转锚链接表格标签规原创 2022-03-02 00:43:23 · 2208 阅读 · 0 评论 -
Vue.js高效前端开发 【初识Vue.js】
全部章节 >>>>文章目录一、Vue概述1、Web前端框架介绍2、MVC和MVVM3、Vue介绍4、安装Vue二、Vue使用1、第一个Vue应用2、Vue的双向绑定3、实践练习三、Vue生命周期1、Vue的实例和数据2、Vue生命周期钩子函数3、实践练习四、过滤器1、过滤器使用2、实践练习总结:一、Vue概述1、Web前端框架介绍近几年,互联网前端行业发展得依旧迅猛,涌现出了很多优秀的JavaScrip原创 2022-03-01 23:40:05 · 655 阅读 · 0 评论 -
SpringBoot 中到底如何解决跨域问题?
大家好,我是路人,这是SpringMVC系列第31篇。今天又给大家带来了一个很重要的知识点:SpringMVC中如何处理跨域问题,本文的内容同样适合于SpringBoot1、跨域访问报错当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨域。出于安全原因,浏览器禁止Ajax调用驻留在当前原点之外的资源,比如从a.com发送一个ajax请求到b.com,则浏览器控制台会报跨域访问错误。如下图,从http://localhost:63342/站点页面中向ttp://localh原创 2022-03-01 19:57:19 · 527 阅读 · 0 评论 -
Postman 使用教程 - 手把手教你 API 接口测试
Postman 教程目录API 是什么?Postman 是什么?一. 如何安装 Postman二. API 模拟工具 GoRest三. 用 Postman 发出第一个 GET 请求1. GET 请求基本操作2. 带参数的 GET 请求3. GET 请求中的多条件查询四. 在 Postman 中发送 POST 请求1. POST 请求前,使用 Postman 对 API 鉴权(2)用 Postman 发出第一个 POST 请求五. 用 Postman 发送第一个.原创 2022-02-28 22:32:06 · 957 阅读 · 0 评论 -
Module build failed TypeError this.getOptions is not a function at Object.loader
这个异常说明了当前 style-loader 的版本过高导致 webpack 的编译错误,需要降低版本解决方法:降低当前style-loader版本npm install style-loader@<version> --save-dev如下:npm install style-loader@1.0.0 --save-dev...原创 2022-02-28 20:19:21 · 677 阅读 · 1 评论 -
es6 promise知识点 王者段位前来挑战
关于promise的知识点,暂且分为 青铜、白银、黄金、铂金、钻石、星耀、王者这几个段位。可能是王者玩多了吧,你到哪一个段位了?青铜你已经用过promise解决过异步编程了,并知道通过调用.then()和.catch()来处理回调函数。基本用法const promise = new Promise(function(resolve, reject) { // ... some code if (/* 异步操作成功 */){ resolve(value); } else {转载 2022-02-26 23:25:00 · 117 阅读 · 1 评论 -
javascript 入门第一天
typora-copy-images-to: img今日内容JavaScript介绍JavaScript的基本语法JavaScript的属性和文本操作JavaScript的Dom操作一.JavaScript介绍1. JavaScript概述JavaScript是一门客户端脚本语言,基于对象和事件驱动的一门客户端脚本语言,可以直接在浏览器端运行。客户端: 浏览器脚本语言:无需编译,可以直接运行(只要电脑上安装了浏览器,可以运行javascript语言).原创 2022-02-26 14:32:42 · 122 阅读 · 0 评论 -
vue 3.0 keep-alive 失效 报错 Cannot read properties of null (reading ‘parentNode‘)
版本:vue “3.2.4”vue-loader “16.4.1”vue-router “4.0.11” <router-view v-slot="{ Component }"> <keep-alive> <suspense timeout="0"> <template #default> <component :is="Component" />原创 2022-02-23 21:50:41 · 2085 阅读 · 0 评论 -
【214情人节】低调奢华有内涵的python程序猿撒狗粮的正确姿势(附源码)
目录一.?效果演示1. 原图-效果图对比2. 看出两张图片的区别了吗?二. 代码架构三. 功能实现3.1?图片处理3.2 html 使用form表单,真心话和图片文件的布局3.3 js 上传文件3.4 服务端 python flask四. 源码下载《孟子.梁惠王下》【独乐乐不如众乐乐】情人节就要到了,小伙伴们一起来皮一皮吧~ ,正如春晚大张伟所言:我们要做自己的气氛大王!一.效果演示1. 原图-效果图对比2. 看出两张图片的区别了吗?将效果图放大,放大,再放大,原创 2022-02-23 00:50:45 · 273 阅读 · 0 评论 -
js判断数组中是否存在某个元素(四种方法)
法一:利用indexOf不存在返回-1,存在返回第一次出现的索引 // js检查数组中是否包含某个元素 // 法一 indexOf var arr = [100,20,50,58,6,69,36,45,78,66,45] if(arr.indexOf(66)==-1){ console.log("不存在") }else{ console.log("存在,索引是:",arr.indexOf(66))原创 2022-02-22 23:25:07 · 6936 阅读 · 0 评论 -
SpringBoot 使用表单或者vue实现文件上传
文章目录一、创建项目二、控制层代码三、表单实现文件上传实现单文件上传实现多文件上传效果截图四、使用vue + axios 实现文件上传引入js文件实现单文件上传实现多文件上传效果图最后附带源码地址本文的前端是HTML表单,另一种vue + axios,后端使用SpringBoot 2.x一、创建项目新建SpringBoot项目,同时导入依赖项目结构两个方法用的同一个控制层接口就直接先上控制层代码二、控制层代码package com.ki原创 2022-02-21 18:59:25 · 428 阅读 · 0 评论