- 博客(22)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 控制台查看js实现的hover状态下元素
这个时候会直接定位到测试元素的element详情。鼠标移动到控制台的element区域。不会这个之前查个元素给我查麻了。打开控制台element页面。把鼠标放到想测试的元素上。
2023-01-18 18:39:31
621
1
原创 vue3 警告 Unhandled error during execution of component event handler
最后发现是我删掉了一个响应式数据的声明,但是使用了那个响应式数据,结果给我报了这么个警告.这个不应该报个userdata is no define吗?这个userdata声明被我删了,但是我没注意到这里有使用.长了个记性,最好还是用git管理项目,知道自己删改了什么内容。这个东西是真的奇葩,我找了半天没找到原因....
2022-08-29 00:26:26
11618
原创 canvas arc()画1/4圆的注意点
canvas这个方面我接触的还很少,无意间了解了怎么用canvas画圆,发现了其中一个坑点,给大家提个醒画圆的核心代码就一句,其他步骤自行了解ctx.arc(x,y,40,0,2*Math.PI,false);x和y是圆心的坐标值40是半径大小0是起始弧度2*Math.PI是结束弧度,Math.PI代表一个π,一个π等于180度,2个π才是圆最后一个选择顺时针还是逆时针画圆,默认顺时针也就是false看实际效果后面是本文重点了当我们想画一个1/4圆的时候顺时
2022-04-24 09:36:00
459
原创 如何禁止a标签跳转页面
方法一:让href的值为javascript:;<a href="javascript:;">点击不会跳转</a>方法二:让点击事件直接返回false<a href="#" onclick="return false">点击不会跳转</a>方法三:通过js阻止默认行为<a href="#" id="test">点击不跳转</a><script> document.querySe
2022-04-19 17:44:52
6099
原创 script标签中async和defer两个属性的作用和区别
背景通过<script>标签引入第三方库,如果因为提供者那边的问题,使得内容加载缓慢,就会阻塞DOM的渲染,就可能会导致页面空白而这两个属性就是用来解决这个问题的相同点都是通过异步立即开始下载脚本文件,这里对这个异步立即下载写一个我自己的理解:当执行到异步的内容时,异步的内容会立即开始下载,但同步的内容不需要等待其下载完毕,而是继续执行后面的内容都不会阻塞DOM的渲染不同点defer要在文档解析完成后才能加载,而且如果有多个<script>标签添加了d
2022-04-17 19:53:09
179
原创 meta元素标签的常见作用
<meta>标签用来提供有关html文档的元数据,元数据不会显示给用户看,但浏览器可以识别,同时对SEO(搜索引擎优化)起着重要作用<meta charset="utf-8">charset属性指定了html文档的编码格式,常用的就是utf-8(Unicode字符编码)content属性定义与name或http-equiv属性相关的元信息,content 属性始终要和 name 属性或 http-equiv 属性一起使用。name属性<meta name
2022-04-15 20:32:16
2013
原创 create-react-app降低react的版本
react最近不是出18了吗但问题是很多的库都还不支持而且工作中不会使用特别新的技术但用create-react-app创建的项目默认为react18版本这里我们降版本只需要一行命令npm install react@17.x react-dom@17.x --save这里有个坑,这两个要同时降!!!,只改一个会报错!!!顺便提醒一下,报错虽然长,但可以用翻译软件翻译一下,我这里也是通过看翻译之后的报错才注意到这个问题.本来很简单的问题,我搞了一个多小时...
2022-04-10 16:41:32
7483
5
原创 HTML5语义化及其优点,语义化标签
我们常用div在加上自定义的类名来表示页面的不同部分,而语义化标签,其实就是帮我们做了这些事,像页面几乎都会有的头部,尾部,导航,主要内容,这些常见模块,我们不需要再使用自定义类名的div,而是直接使用对应的语义化标签<header>,<footer>,<nav><main>所以语义化就是通过使用这些语义化标签,让页面的内容结构更清晰,便于开发者的阅读,维护,同时更有利于SEO(Seach Engine Optimization 搜索引擎优化)搜索引擎
2022-04-09 12:29:20
523
原创 伪类和伪元素
相同点:都是一种选择器伪类: 它用于选择处于特定状态的元素伪类又分为简单伪类,例如:选择第一个元素的:first-child和用户行为伪类,例如:鼠标悬停:hover我自己的理解是当元素处于特殊状态(例如:鼠标悬停其上)或者特殊位置(例如:第一个元素)时,可以通过伪类选择器修改它们的样式.伪类只是修改了样式,但不会添加元素伪元素:用于创建一些不在文档树中的元素，并为其添加样式。我的理解:伪元素选择器可以添加新的元素,并且为其添加样式,例如::before,我们可以改变它的内容也可
2022-04-08 15:52:27
71
原创 html的新特性有哪些
新增选择器 document.querySelector、document.querySelectorAlldocument.querySelector()只返回第一个满足条件的标签 document.querySelectorAll()返回所有满足条件的标签,会返回一个伪数组,伪数组和数组类似可以遍历,有length属性,但一些数组的方法没有,例如:push,map,shift拖拽释放(Drag and drop) API用户可使用鼠标选择可...
2022-04-07 10:52:12
3239
原创 react Tinymce富文本使用报错Uncaught SyntaxError: Unexpected token ‘＜‘
这个问题其实很简单就解决了,但我走了不少弯路,希望看到文章的兄弟们不要再踩坑了首先,出现这个问题,应该是在把Tinymce本地化其实这个东西本地化特别简单,网上有些过时的内容,写了一大堆,把我坑惨了下载文件都一样的,不再多说从引入文件开始解压之后把文件里的那个tinymce文件放public然后在index.html加入 <script src="%PUBLIC_URL%/tinymce/tinymce.min.js"></script>
2022-04-02 18:40:52
3859
2
原创 html标签的类型（head， body，Doctype） 他们的作用是什么
<head>:用来存放头部元素,例如:<title>,<script>,<link>,<meta>等等<body>:文档的主体部分,用户可见的文本,图片,音频,视频等都是放在这里<!Doctype>:(标题处不能加!,注意这里是需要!的)放在文件的第一行,在<html>之前<!DOCTYPE> 不是 HTML 标签；它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编
2022-04-02 16:18:20
778
原创 antd table dataIndex拿不到对象里属性的值
找这个问题的八成是这样写的跟我一样请给我点个赞,哈哈哈看官方文档是怎么说的所以正确的写法事实证明要多看文档
2022-03-27 16:21:47
2097
3
原创 react useState数据已经更新,但函数中使用的还是旧数据
先看现象首先初始值为0在发请求的函数中打印当时获得的username值页面刚渲染时的效果将用户名改为zhangsan,发请求得到的效果此时查看react的开发者工具可以看到数据已经更新此时我通过其他方式调用发请求的方法这种方式使用的数据还是一开始的初始值再次查看开发者工具可见username确实还是张三所以问题就出在调用getUsers的那里看一下具体场景具体代码这里使用useState,问题就是在这上...
2022-03-26 14:46:57
5293
2
原创 react 项目启动显示本地连接已拒绝
很奇怪的问题,我在前一天还能正常使用,第二天打开电脑启动项目就出现了问题.在百度上没有找到react 项目启动显示本地连接已拒绝的解决方案通过git版本回溯到上一个版本就可以正常连接一开始实在没办法,我就从上一个版本接着写结果后面出现版本冲突,我手动解决之后,再次启动项目又是本地连接被拒绝...当时给我气的,人麻了再接着实在找不到办法,我只好用蠢办法新建项目,确定新项目可以启动.再将原项目的文件一个个搬过去最后我成功找到了罪魁祸首这个东西是用来做代理的,把这个
2022-03-21 16:34:29
4274
7
原创 使用vue-animate-number报错显示找不到start()
报错如图:根据开发者的readme文件中的例子使用出现报错,说找不到start函数,我一开始还以为开发者把函数改名了,没在readme里更新,特意去看了看源码.函数名确实是start然后我打印了this.$refs.myNum得到从这里看其实很明了了,但我还是花了点时间才反应过来我使用了v-for循环,所以得到的是一个数组!!!所以需要 this.$refs.myNum[0].start()...
2022-03-13 13:59:37
541
原创 json-server post请求报错,状态码为500
写登录页面使用json-server碰到的情况,get请求没问题,数据本身没问题,但post请求添加数据时报错,状态码为500后面尝试发现是我没加id属性,加上属性"id"就ok了对后端不了解,单独的想测试,简单的学了一下使用,没想到还有这么个坑...
2022-02-01 23:03:10
1670
1
原创 vue项目在gitee pages上是空白页的情况
具体情况是页面一片空白,但是没有404打开控制台会发现有报错大概意思就是那些资源没有响应这里先推荐这篇文章我的解决办法,实际来自这里问题实际出在路径上在vue.config.js中添加如下内容const BASE_URL = process.env.NODE_ENV === "production" ? "/my_web/" : "./";module.exports = { publicPath: BASE_URL,}这里其实就是修改了路径,如果是生产版本就在路径
2022-01-22 01:00:42
1156
1
原创 vue-cli build之后打开网页是空白页
打开网页的情况是一片空白,也没有404f12检查可以发现这里的路径都是'/'开头这是原因所在,具体可以看vue官网的参考配置的publicPath这一块他的默认配置是'/'我们需要的是'./'解决办法在vue.config.js中(这个文件如果没有需要自己创建)添加module.exports = { publicPath:'./' }然后重新 npm run build这里提一下我有看见其他博客说什么在config/inde.
2022-01-21 16:16:35
1588
原创 vue element UI 按需引入找不到.babelrc
这个坑有点无语....这个东西新版本改名字了,现在叫babel.config.js就是图片上这东西module.exports = { presets: [ '@vue/cli-plugin-babel/preset' ]}里面的初始内容当我们修改时不是按照elementUI官网的直接复制粘贴覆盖整个文件!!!是添加相应的内容module.exports = { presets: [ '@vue/cli-plugin-babel/prese
2022-01-20 21:26:54
2545
原创 vue transition + animate.css 无效
关于这个问题,我踩了两次坑1.没加animate的基础类<h1 class="animate__animated animate__bounce">An animated element</h1>第一个animate__animated 是基本类,每次使用都要加上第二个是你可选的效果2.使用了span标签 <div class="title"> <transition enter-active-class="animat
2022-01-19 22:24:48
721
空空如也
vue transition + animate.css 对span标签无效的情况
2022-01-19
TA创建的收藏夹 TA关注的收藏夹
TA关注的人