前端
文章平均质量分 57
m0_66557301
这个作者很懒,什么都没留下…
展开
-
IDEA打开vue项目并运行
一、安装vue插件,重启IDEA二、配置npm打开你的vue项目根目录红色框内为你的安装目录,绿色框内保持一致即可!配置install命令配置run命令三、Terminal中输入npm install、npm run serve启动项目#安装依赖npm install#运行项目npm run serve#打包部署服务器npm run build打开对应网址看看效果吧四、项目部署到服务器https://blog.csdn.net/qq_29752857/a原创 2022-03-12 13:01:54 · 4274 阅读 · 1 评论 -
Vue3x路由跳转及传参(useRouter)
useRouter 相当于vue2的this.$router全局的路由实例,是router构造方法的实例useRoute 相当于vue2的this.$route表示当前激活的路由的状态信息,包含了当前 URL 解析得到的信息,还有 URL 匹配到的 route路由记录import { useRoute, useRouter } from "vue-router"useRoute, useRouter必须写到setup中,详见vue-next-router.强行在函数中使用这两会报undefined原创 2022-03-11 21:34:27 · 522 阅读 · 0 评论 -
Vue 基础语法
Vue 基础语法1.v-bind2.条件渲染3.列表渲染4.绑定事件5.双向数据绑定6.组件的使用【狂神说Java】Vue最新快速上手教程通俗易懂 笔记:Vue 基本语法、Vue 绑定事件、Vue 双向绑定、Vue 组件讲解。1.v-bindv-bind 主要用于属性绑定。示例如下:<body><div id="app"> <span v-bind:title="message"> 鼠标悬停几秒钟查看此处动原创 2022-03-11 19:56:08 · 465 阅读 · 0 评论 -
thinkphp6搭建后端api接口
这段时间学习了一下简单搭建一个api接口后端服务,现在记录一下。本文主要内容下载tp6打开错误调试隐藏入口文件解决跨域问题-(使用全局中间件处理)路由解决api版本控制jwt token验证-(使用路由中间件验证)统一的参数返回形式异常捕捉自动生成api文档(插件实现)1、下载tp6我使用的是集成环境phpstuday,安装了composer,通过composer安装tp6,thinkphp官网已经不再支持直接下载。composer create-project topthin原创 2022-03-11 18:33:10 · 2044 阅读 · 0 评论 -
Mybatis-plus3.5.1+版代码自动生成(FastAutoGenerator)
该方法适用于mybatis-plus 3.5.1 +以上的版本准备工作Maven依赖<!--逆向工程--> <dependency> <groupId>com.baomidou</groupId> <artifactId>mybatis-plus-generator</artifactId> <version>3.5.1<.原创 2022-03-11 14:32:40 · 1421 阅读 · 0 评论 -
in .srccomponentslogin.vuevue&type=style&index=0&id=10d9df09&lang=less&scoped=true&
ERROR Failed to compile with 1 error上午10:28:10 error in ./src/components/login.vue?vue&type=style&index=0&id=10d9df09&lang=less&scoped=true&Syntax Error: TypeError: this.getOptions is not a function @ ./node_modules/vue-s.原创 2022-03-11 13:10:32 · 363 阅读 · 0 评论 -
Echarts legend属性使用
Echarts的legend属性是对图例组件的相关配置而legend就是Echarts图表中对图形的解释部分:其中legend自身常用的配置属性如下:orient设置图例的朝向属性值:vertical // 垂直显示或者horizontal // 水平显示legend: { orient: 'vertical' } legend: { orient: 'horizontal' }x/y(left/top)设置图例在X轴方向原创 2022-03-11 11:49:05 · 4154 阅读 · 0 评论 -
1、【Echarts系列】Vue中设置echarts折线图样式(图表、网格、标签、提示、标题、文字),手把手教程系列
一、echarts 折线图(折线统计图)折线图在我们也是我们的数据可视化图表中最常用的一种图表之一,是用折线将各个数据点标志连接起来的图表,不仅可以表示数量的多少,而且可以反映同一事物在不同时间里的发展变化的情况以及变化趋势。看着官网示例的这些花花绿绿的折线图,相信在日常的开发中,只要稍加配置调一下,已经可以满足9成的需求了。二、echarts的下载、安装与使用在上一篇的文章里,我们主要是学习如何快速上手Echarts的一些属性设置,我们演示的时候用的引入方式是一次性引入所有的资源。如这样:i原创 2022-03-11 10:27:28 · 5086 阅读 · 1 评论 -
解决谷歌浏览器 google chrome 安装插件报错:Download interrupted,不支持 .crx 文件下载
最近给 新的 macBook Pro 2020 笔记本的 chrome 浏览器安装 react developer tools 时(翻墙情况下),安装总是不成功,有一个弹框提示:Download interrupted。一开始我以为是第三方插件出了问题,于是我去安装其他的插件,都会提示这个错误。然后我开始去巡查 是否是 翻墙出了问题,经过测试发现,没有问题,谷歌浏览器正常工作。于是我去网上查找原因,说是 新版的 chrome 浏览器 不再支持 .crx 的文件下载。不过很奇怪,同事和我一样的电脑,一原创 2022-03-10 12:45:12 · 4409 阅读 · 1 评论 -
使用Playwright绕过Webdriver检测
Playwright是微软开发的自动化测试工具,支持近乎目前市面上绝大部分的浏览器。但是由于是新生产物,所以很多细节可能还不如Selenium操作起来比较顺手。例如,使用Selenium打开网页时,可以使用execute_cdp_cmd在load完毕后执行指定的js对页面进行hook使得Selenium自带的Webdriver属性得以隐藏。例如:from selenium import webdriver# addfrom selenium.webdriver import ChromeOpti原创 2022-03-09 13:41:06 · 2051 阅读 · 0 评论 -
[Vue warn] “TypeError Cannot read properties of undefined (reading ‘push‘)“
一般出现这问题是由于this.$routers的路径或者命名问题,找了半天发现自己在组件中使用的路由少了一个“s”和main.js的不一致所以出现了报错。修改为相同的就可以了,如果原来就是相同的看一下router有没有安装和路径是否正确。组件中使用的:mian.js中使用的:...原创 2022-03-09 12:20:40 · 1857 阅读 · 0 评论 -
vue前后端分离后台管理系统(权限管理,登录),对接后端SpringSecurity,实现权限管理功能
文章目录一、重要知识点总结以及登录功能实现二、权限管理菜单的增删改查实现1. 路由配置2. 用户管理功能2.1 后端接口API介绍2.2 前端api接口2.3 页面和逻辑编写3. 角色管理功能3.1 数据回显4. 菜单管理功能4.1 树形结构数据处理算法三、权限控制功能实现1. 拆分路由2. 将用户角色和菜单权限保存到vuex,然后过滤路由3. 使用模板需要做的额外更改4. 解决刷新页面vuex中数据丢失,路由丢失问题四、按钮权限控原创 2022-03-09 10:56:48 · 1217 阅读 · 0 评论 -
vue3 src 用require 动态导入图片报错和解决方法
vue3 动态的导入图片vue3 如果使用的是typescript开发,就会出现require引入图片报错,require is not defined 不能像使用vue2 这样imgUrl: require(’…/assets/test.png’) 导入,是因为typescript不支持require所以用import导入,下面介绍如何解决: 使用await import(’@/assets/img/22.png’);demo.vue<template> <img :sr原创 2022-03-09 09:35:56 · 7713 阅读 · 2 评论 -
uniapp页面滚动监听
先在前面总结下,下面一共有3种监听滚动的方法。昨天在做uniapp的图片懒加载,从网上找了个插件,导入到HBuilderX后,捣鼓了一晚上,总算是正常跑起来了。今天早上,把代码copy到项目上,结果只有第一屏的图片能展示,滑动后,下面的图片都不显示了!-_-!因为有了昨晚的经验,很快就定位到问题是滚动监听出现了问题。这个插件的图片懒加载一个关键的地方就是用到滚动监听。第一种在普通页面可以用生命周期的“onPageScroll”方法,如下:onPageScroll(e) { // 传入scro原创 2022-03-09 08:01:46 · 12441 阅读 · 0 评论 -
react 使用 useEffect 只执行一次
本文主要讲解 使用 useEffect 在函数式组件中只执行一次,但是会报警告的问题该如何去解决首先只执行一次的话,使用函数作为useEffect回调,然后依赖项传空,像这样useEffect(fetchBusinesses, [])但是这样有一个问题,就是如果不填写依赖项,eslint 会抱一个警告,提示你需要依赖 fetchBusinesses1. 解决警告的一种方法是:声明内部功能useEffect(),将 fetchBussinesses 方法放在 effect 内部去声明useEffe原创 2022-03-08 13:21:20 · 796 阅读 · 0 评论 -
MySQL数据库 ---MySQL表的增删改查(进阶)
文章目录MySQL表的增删改查(进阶)1. 数据库约束1.1 约束类型1.2 NULL约束1.3 UNIQUE:唯一约束1.4 DEFAULT:默认值约束1.5 PRIMARY KEY:主键约束1.6 FOREIGN KEY:外键约束1.7 CHECK约束(了解)2. 表的设计2.1 一对一2.2 一对多2.3 多对多3. 新增4. 查询4.1 聚合查询4.1.1 聚合函数4.1.1.1 COUNT4.1.1.2 SUM4.1.1.3 A原创 2022-03-08 12:01:01 · 314 阅读 · 0 评论 -
JavaScript中WebAPI知识
目录1、什么是WebAPI2、DOM中的基本概念2.1、DOM树(文档对象类型)3、获取元素和事件3.1、获取元素?3.2、事件4、操作元素4.1、获取/修改元素中的内容4.2、获取/修改元素中的属性4.3、获取/修改表单元素中属性4.4、获取修改样式属性4、如何操作节点4.1、新增节点1)创建元素节点2)插入到Dom树中4.2、删除节点1、什么是WebAPIAPI(Application Programming Interface,应用程序编程接口)是一些预先定义的函原创 2022-03-08 10:40:41 · 269 阅读 · 0 评论 -
Elementplus中icon的使用
在使用Elementplus中使用icon图标的时候遇到的问题说是未能解析组件,在请教过老师之后得出解决方法:这个plus组件要先import导入才能用,每个图标都是一个组件,用一个导一个比如:import { Edit } from '@element-plus/icons'; // svg图标之后再<el-icon style="vertical-align: middle;"><edit/></el-icon>注意标签里面一般都是全小写,当然也原创 2022-03-08 09:20:28 · 987 阅读 · 1 评论 -
Access to XMLHttpRequest at‘httplocalhost跨域问题解决
在vue.config.js里配置跨域请求跨域问题报错解决在vue.config.js中配置module.exports = {// 配置跨域请求devServer: {port: 8080,host: ‘localhost’,open: true,https: false,proxy: {‘/api’: {target: ‘http://需要请求的地址/’,ws: true,changeOrigin: true,pathRewrite: {‘^/api’: ‘’}原创 2022-03-08 08:00:23 · 4760 阅读 · 0 评论 -
15个 Vue 技巧,开发有段时间了,才知道还能这么用(你所知道真的包括这些吗?)
目录前言1、将一个 prop 限制在一个类型的列表中2、使用引号来监听嵌套属性3、知道何时使用 v-if4、单个作用域插槽的简写5、将局部和全局的 style 混合在一起6、重写子组件的样式7、如何在 Vue 之外创建一个具有响应性的变量8、v-for 中的解构9、在指定范围内循环10、窃取 prop 类型11、检测元素外部(或内部)的单击12、从组件外部调用一个方法13、监听数组和对象14、template 标签的另一个用途15、处理错误(和警告)的更好方法前言学习成原创 2022-03-07 20:49:37 · 75 阅读 · 0 评论 -
(毕设1)爬虫+mysql+flask+echarts实现网站数据可视化(附源码)
目录1. 项目要求与内容?2.数据爬取2.1分析url,网页源码2.2编写代码2.3 数据清洗3.数据存储3.1?mysql中需要建立的6张表3.2 建表语句3.3将2中清洗后的数据通过navicat导入4.flask web网站的搭建4.1 使用pycharm建一个flask项目4.2 后端4.3 前端4.4项目框架5.项目展示6.源码?点击1. 项目要求与内容利用python爬取数据并进行清洗和预处理,将清洗后的数据存到mysql数据库中,后端利用flask框架,用原创 2022-03-07 10:46:30 · 3029 阅读 · 1 评论 -
能够有效提升开发效率的 20 余款 VSCode 插件(多图带效果展示)
能够有效提升性能的 20 余款 VSCode 插件代码快捷键、报错信息、代码注释,总有一款 VSCode 的插件能够提升你的工作效率。有下载量可以说是非常大、百万级别的插件,至少感觉是应该下载试用一下的插件们,也有你可能都没有听说过,但是个人体验非常好用的插件。Auto Rename Tag使用效果如下:又因为 auto rename tag 中并不是一定需要输入“合法”的标签名,所以对于其他的框架——例如说 React——来说,用途也挺大的。Image Preview不知道自己是不是插入原创 2022-03-07 09:22:58 · 397 阅读 · 0 评论 -
Java项目OA办公管理系统(java+Layui+SSM+Maven+mysql+JSP+html)
一、项目运行环境配置:Jdk1.8 + Tomcat8.5 + mysql + Eclispe(IntelliJ IDEA,Eclispe,MyEclispe,Sts都支持)项目技术:JSP +Spring + SpringMVC + MyBatis + html+ css + JavaScript + JQuery + Ajax + layui+ maven等等用户管理控制层:/** * @author yy */@Controller@RequestMapping("/u原创 2022-03-07 07:59:38 · 105 阅读 · 0 评论 -
前端案例:我的备忘录(支持事件的增加、删除和修改,代码完整)
本案例未使用任何框架,均使用 js 原生以及 DOM 操作实现,代码完整,复制即用。目录一、案例效果二、涉及要点1. 事件监听2. DOM 节点操作(1)常用节点获取方法(2)常用节点信息获取方法(3)常用节点属性获取方式(4)DOM 修改(5)DOM 添加(6)DOM 删除3. DOM 控制 CSS 样式(1)通过 style 属性控制样式(2)通过classList控制样式:三、完整代码+详细注释一、案例效果如下图,备忘录可添加新事件,对事件进行编辑,删除已有事件,原创 2022-03-06 04:31:20 · 533 阅读 · 0 评论 -
【罗盘时钟(星空版)---使用html,js,css编写。(附全部源代码+效果)】
目录效果源代码效果换个背景:源代码index.html<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>CSDN---追梦者</title><link rel="stylesheet" href="css/clock.css"></head><body><ul cl转载 2022-03-06 03:09:21 · 1348 阅读 · 1 评论 -
vue项目报错Uncaught (in promise) TypeError Cannot read properties of undefined (reading ‘getAttribute‘)
1.项目中用到了echarts图表,每次切换路由的时候,控制台就会报一堆错误:Cannot read property ‘getAttribute’ of undefine后来发现是设置了图表自适应导致的,在里面是使用addEventListener来进行图表自适应,但是在离开当前页的时候,没有清除,就导致了上面的报错。mounted () { window.addEventListener('resize', this.initEchart, 20) this.getEcharts原创 2022-03-06 01:48:33 · 2933 阅读 · 0 评论 -
vue3.0 从入门到入土---复习 组件高级上
目录watch 侦听器组件的生命周期? ??组件之间的数据共享vue 3.x 中全局配置 axios总结watch 侦听器1. 什么是 watch 侦听器watch 侦听器 允许开发者监视数据的变化,从而 针对数据的变化做特定的操作 。例如,监视用户名的变化并发 起请求,判断用户名是否可用2. watch 侦听器的基本语法开发者需要 在 watch 节点 下,定义自己的侦听器。实例代码如下3. 使用 watch 检测用户名是否可用监听 username 值的变化,并使用 axio原创 2022-03-06 00:27:11 · 204 阅读 · 0 评论 -
Avue-crud常用配置项
Avue是一款基于Element-Ui再封装的一款ui框架,使用方便。但是自己在工作中经常记不住一些配置,虽然Avue官网上面都有这些配置说明,但是有时候自己还是会找很久才找到,为了方便自己今后查找使用,将一些常用的配置梳理在下面1、表格配置项 option<avue-crud :option="option" ref="crud" //表格常用事件 @on-load="getList"//这个事件会在表格所在的组件加载时就会执行后面的getList方法,初始化表格数据。原创 2022-03-05 20:12:44 · 1122 阅读 · 0 评论 -
uniapp使用uni-data-picker插件实现省市区弹窗(兼容app)
官方文档:uni-app官网1.使用HBuilder导入插件.uni-data-picker 数据驱动的picker选择器 - DCloud 插件市场2.导入成功后,在src文件夹下多一个uni_modules的文件夹3.引入插件import uniDataPicker from '@/uni_modules/uni-data-picker/components/uni-data-picker/keypress.js';4.在页面中使用<uni-data-picker :lo原创 2022-03-03 22:38:43 · 1502 阅读 · 1 评论 -
Typora常用好看主题推荐
Typora常用好看主题推荐!!!Typora 是一款支持实时预览的 Markdown 文本编辑器。它有 OS X、Windows、Linux 三个平台的版本,并且是完全免费的。在作者心里,Typora的存在是简约而强大的,加上作者是艺术生出身,对于主题和颜色的美观是有一定要求,所以喜欢收集好看简约的主题,现有几款觉得好看的分享给大家。先挂几个链接,以便同样喜欢自己研究主题的小伙伴参考Typora官网主题: https://theme.typora.io/为 Typora 编写自定义主题:原创 2022-03-03 21:43:59 · 3648 阅读 · 1 评论 -
nodeinternalmodulescjsloader936错误的解决办法
错误如下原因,npm 安装包有误,少了一部分模块,我当时是去nodejs官网下载了相应版本的压缩包zip 然后解压出来把新的文件代替我之前缺少模块的文件。这个方法可以解决问题哦注意一个要点安装一个包的时候一定要一步一步先初始化再进行安装一般项目是先 npm init 初始化,然后在 npm i -S 要安装的包 。...原创 2022-03-03 16:01:36 · 471 阅读 · 0 评论 -
JavaScript中的数组方法总结+详解
在JS中,数组方法是非常重要且常用的方法.在此整理总结一番.JavaScript 数组的力量隐藏在数组方法中。1. javaScript常用数组方法顺序方法名功能返回值是否改变原数组版本1push()(在结尾)向数组添加一或多个元素返回新数组长度YES5-2unshift()(在开头)向数组添加一或多个元素返回新数组长度YES5-3pop()删除数组的最后一位返回被删除的数据YES5-4shift()移除数组的第一项返回被删除的数据YES5原创 2022-03-03 14:57:00 · 195 阅读 · 0 评论 -
element-ui.common.js2353 Uncaught TypeError Cannot read properties of null (reading ‘disabled‘)
这个是由于使用 element-ui 的Dropdown 下拉菜单遇到这个错误一定要仔细排查自己的代码el-dropdownel-dropdown-menuel-dropdown-item这三个缺一不可仔细排查是不是中间的el-dropdown-menuel-dropdown-item没有写如果是多人开发,自己的部分没有问题,一定就是你的小伙伴哪里写错了。ps:踩坑,找了一上午。哭死...原创 2022-03-03 13:52:37 · 760 阅读 · 0 评论 -
@PathVariable注解的用法和作用(Demo详解)
hello你好我是辰兮,很高兴你能来阅读,本篇整理了关于@PathVariable注解的一些用法,用案例测试,留给自己,分享给初学者,分享获取新知,大家一起进步!文章目录一、注解解释二、代码实践一、注解解释@PathVariable 映射 URL 绑定的占位符通过 @PathVariable 可以将 URL 中占位符参数绑定到控制器处理方法的入参中:URL 中的 {xxx} 占位符可以通过@PathVariable(“xxx”) 绑定到操作方法的入参中。一般与@Re.转载 2022-03-03 12:01:09 · 455 阅读 · 0 评论 -
2020新版idea创建项目没有javaEE 没有Web选项怎么办
正常创建java项目然后右击点击第二个,添加框架就可以看到啦 勾选web点击apply ok 就可以啦原创 2022-03-03 00:10:27 · 518 阅读 · 0 评论 -
非培训的前端转行之路(根据个人真实经历)
我是歌谣 放弃很很难 但是坚持一定很酷 本文乃本人真实经历书写希望对你的工作和学习有所帮助 感谢你得阅读前言我是歌谣,当然真名不是叫歌谣。歌谣的原因1. 歌谣可以传承很久 影响比较大2. 歌谣可以让人心情愉悦 让人积极向上3. 名字里面有个谐音 哈哈…说多了 有点扯皮了 就这样大概介绍一下咯记住我是歌谣就行了 也会长期活跃在该平台~哈哈首先这篇文章不是一天两天能够完成的 我得仔细梳理可能发布的时候已经过了一两周吧此处应该配个图要不明天在写吧 今天就到这。配一张我得壁纸吧.原创 2022-03-02 13:39:59 · 548 阅读 · 0 评论 -
vue学习笔记 export ‘default‘ (imported as ‘Vue‘) was not found in ‘vue‘
版本:vue3 vue/cli 5.0.0做写store时报错import Vue from "vue";import Vuex from "vuex";import getters from "./getters";import user from "./modules/user";Vue.use(Vuex);const store = new Vuex.Store({ modules: { user, }, getters,});export default原创 2022-03-02 12:35:08 · 1615 阅读 · 0 评论 -
因 N-API 发音对黑人的头发不友好,Node.js 官方将其改名为 Node-API
N-API 是用来给 Node.js 构建本机插件的 API,它由 Node.js 官方维护。此 API 将是 Node.js 的应用程序二进制接口(Application Binary Interface,ABI)稳定版。它旨在将插件与底层 JavaScript 引擎中的更改隔离开来,这样低版本已经编译好的模块可以直接在高版本的 Node.js 上运行而无需重新编译。但是 Node.js 成员 James M Snell 指出:N-API 的发音是 “En-Ay-Pee-Eye”,这个发音和 “napp原创 2022-03-02 02:35:45 · 112 阅读 · 0 评论 -
vue环境变量配置——process.env(详细)
在用vue框架时,经常用到两种环境,一种是开发环境,就是本地开发时的环境,一种是生产环境,就是要发布到线上的环境。平时开发是用生产环境的,如果发布到线上时,需要切换环境为线上。如果人为去切换也是可以的,但是会容易忘记,可以通过配置不同的运行命令来自动切换环境。下面开始:配置环境的实现原理实现原理就是采用node.js顶层对象中的process.env(进程环境,返回一个包含用户环境信息的对象)属性,根据各个环境的配置文件区分和切换环境具体实例1. 安装依赖npm install process原创 2022-03-02 00:28:32 · 677 阅读 · 0 评论 -
VScode之setting.json文件——vue3插件之Vue Language Features (Volar) & 格式化插件之ESLint
VScode之setting.json文件——vue3插件之Vue Language Features (Volar) & 格式化插件之ESLintvue3插件——Vue Language Features (Volar)格式化插件——ESLint设置-打开设置{ "editor.fontSize": 16, "[html]": { "editor.defaultFormatter": "HookyQR.beautify" }, "liveSe原创 2022-03-01 23:25:04 · 2484 阅读 · 0 评论