- 博客(70)
- 问答 (3)
- 收藏
- 关注
原创 npm install报错常用解题思路
因为业务需求,我安装一个第三方库,但是它不支持React16,然后我想着干脆就升到17吧!结果终端报错,查看一下果然是那些旧依赖导致的,要是全部将他们升级到对应17的版本工作量太大!比如说我们的项目用的是Ant Design Pro 4.5.0版本,要求React17.0.2版本。2.1 旧版本的依赖项无法与新版本的npm兼容,这就需要我们后缀--legacy-peer-deps。明明是去年起的项目,但是它所用的技术栈都很旧,我启动项目,控制台一堆warning报错。
2023-11-24 15:53:18
887
原创 a标签属性target =“_ blank“是否需要加下划线?
target="blank"在功能上看上去和target="_blank"一样,都是跳转到一个新页面。当我们使用第一个写法(不加_),连续多次点击a标签后,我们会发现总是跳转到第一次打开的新页面,即同一个页面,个人猜测这可能是浏览器对其进行了处理,但由于不是关键词'_blank',所以默认为新页面的名称?补充:那为什么target="blank"这个错误写法依然能跳转一个新页面呢?第二个写法(加_),多次点击会新增多个新页面,这才是我们需要的功能!
2023-01-13 12:27:02
1817
原创 Uncaught Error: React.Children.only expected to receive a single React element......
antDesign组件库某个属性需要更新。如:visible ——> open。
2022-12-12 18:56:54
1055
原创 前端项目打包后生成的static文件下的文件为什么都会携带hash值?
前端项目打包后生成的static文件下的文件为什么都会携带hash值?这是因为要保持最新的数据!由于文件名一直在变化,所以每次加载静态资源时都会进行协商缓存。。。
2022-09-27 21:26:33
593
转载 vue3中setUp函数的2个参数详解
原文地址:vue3中setUp函数的2个参数详解https://www.cnblogs.com/IwishIcould/p/14952332.htmlsetup(props,context){}第一个参数: props,是一个对象,包含父组件传递给子组件的所有数据。 在子组件中使用props进行接收,包含配置声明并传入的所有的属性的对象,也就是说:如果你想通过props的方式输出父组件传递给子组件的值。 你需要使用props进行接收配置。即props:{...
2021-12-28 11:36:53
4277
转载 为什么vue3 watch( )无法监听对象属性
原文章地址:为什么vue3 watch( )无法监听对象属性 - 掘金 (juejin.cn)总结原因:在使用watch的时候,第一个参数为可直接传递响应性对象或包含响应性对象的函数。这个限制是因为Vue响应系统需要利用Proxy的getter收集依赖,如果传递非Proxy类型,导致追踪失败。...
2021-12-23 10:15:38
1516
原创 npm install装第三方组件库依赖报错解决办法
npm ERR! Cannot set properties of null (setting ' dev' )
2021-12-02 14:37:43
5186
原创 部署vue2.0项目全过程
目录1. 从后台拿到项目所需的sql包和jar包2. 使用Navicat for MySQL部署sql包1. 在自己的云服务器上开放3306端口,以及本次项目所需要开放的端口号(假设为8002)2. 在MySQL里新建连接(自己设置密码,复杂点,以防有人攻击数据库)3. 在新创建的连接里新建数据库(数据库名由后台提供)4. 在新数据库里的表里运行sql文件(不显示表的话刷新一下)5. 点击用户,新建用户(用户名和密码由后台提供),并赋权3. 在cmd或者Xshell里使用
2021-10-22 00:07:29
2799
原创 防抖与节流
目录应用场景1. 通过使用underscore loadash等前端工具库里封装的debounce和throttle函数防抖节流2. 自己封装debounce和throttle函数防抖节流防抖与节流属于高级函数的内容,用来解决事件的频繁发生而导致的服务器的宕机。应用场景1.scroll事件滚动触发2.搜索框输入查询3.表单验证4.按钮提交事件1. 通过使用underscore loadash等前端工具库里封装的debounce和throttle函数
2021-10-20 23:10:14
139
原创 Axios ——基于 promise 的 HTTP 库
目录1. 原生ajax请求2. jQuery封装下的ajax请求3. axios请求基本使用简写方式axios实例4. 请求拦截1. 原生ajax请求实例化http请求对象 打开连接,设置请求的配置参数 发送请求并且配置请求体中的参数 监听http连接状态的改变,获取响应<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <
2021-10-19 22:21:57
1655
原创 vue的状态管理模式——Vuex
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。(俗称状态机)它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。 状态机可以将所有需要共享的数据进行统一维护,当某个组件需要时,直接引入即可。 状态机可以对请求代码进行封装,其他任何组件可以直接调用。 这个状态自管理应用包含以下几个部分:state,驱动应用的数据源; view,以声明方式将state映射到视图; actions,响应在view上的用户输入导致的状态变
2021-10-19 22:02:45
566
原创 vue的路由
目录1. 渲染函数render(针对的是组件模板)plugin2. 路由机制3. 动态路由匹配4. 嵌套路由5. 编程式导航6. 路由组件传参path-query 传参name-params 传参7. 路由模式hash 模式vue-router 使用的模式8. 导航守卫 -——路由的改变会触发导航守卫组件内部守卫全局守卫路由独享守卫1. 渲染函数render(针对的是组件模板) //组件模板:
2021-10-19 00:27:36
153
原创 vue的插槽
vue插槽允许我们在调用子组件的时候为子组件传递模板。 <slot> 元素作为承载分发内容的出口。 一个不带 name 的 <slot> 出口会带有隐含的名'default'。 父级模板里的所有内容都是在父级作用域中编译的;子模板里的所有内容都是在子作用域中编译的。1. 插槽类别默认插槽(普通插槽)<slot>123</slot><slot name="default">123</slot>具名插槽<slo
2021-10-13 23:53:47
100
原创 vue的组件
目录1.组件机制2.组件注册3.组件交互/通信4.组件传值1. 组件机制组件 (Component) 是 Vue.js 最强大的功能之一。组件可以扩展HTML元素,封装可重用的代码。在较高层面上,组件是自定义元素,Vue的编译器为它添加特殊功能。在有些情况下,组件也可以表现为用is特性进行了扩展的原生 HTML 元素。组件注册的时候需要为该组件指定各种参数。因为组件是可复用的 Vue 实例,所以它们与 new Vue 接收相同的选项,例如 data、computed、watch、
2021-10-12 21:58:33
145
原创 vue中v-if和v-show的区别
在先谈区别前,首先我们都知道他们其实都是vue中的条件渲染,只是他们两种应用场景不同结论:v-if(可以单独使用),通过控制dom节点的渲染,实现显示与隐藏。表达式为true的时候渲染使用v-if属性的元素,否则使用v-else渲染 不推荐同时使用 v-if 和 v-for。当 v-if 与 v-for 一起使用时,v-for 具有比 v-if 更高的优先级。 v-show(切换css样式中display属性),通过控制dom节点css样式中display,频繁切换css样式来显示与隐藏某个组件
2021-10-11 21:45:27
190
原创 vue的模板语法
Vue使用了基于HTML的模板语法,允许开发者声明式地将DOM绑定至底层Vue实例的数据。所有 Vue的模板都是合法的 HTML,所以能被遵循规范的浏览器和HTML解析器解析。在底层的实现上,Vue 将模板编译成虚拟 DOM 渲染函数。结合响应系统,Vue 能够智能地计算出最少需要重新渲染多少组件,并把 DOM 操作次数减到最少。ps:如果熟悉虚拟 DOM 并且偏爱运用原生JavaScript ,可以不用模板,直接编写渲染函数render,使用可选的 JSX 语法(react采用的就是jsx语法...
2021-10-11 21:16:56
139
原创 数组排序的几种方法
1.冒泡排序比较相邻的元素。如果第一个比第二个大,就交换他们两个。 对每一对相邻元素做同样的工作,从开始第一对到结尾的最后一对。在这一点,最后的元素应该会是最大的数。 针对所有的元素重复以上的步骤,除了最后一个。 持续每次对越来越少的元素重复上面的步骤,直到没有任何一对数字需要比较。let arr = [5, 2, 3, 4, 1];let bubbleSort = (arr) => { // 控制比较轮数 for (i = 0; i < arr.le
2021-10-10 22:38:47
7746
原创 简易运用原生js写vue双向数据绑定
<!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"> <title>v.
2021-10-10 22:29:35
106
原创 vue的生命周期(钩子函数)
1.定义:从vue实例创建到虚拟dom产生再到数据绑定监听数据渲染以及销毁的整个过程2.生命周期的第一步首先是创建vue实例,并且进行初始化。(1)vue实例初始化阶段beforeCreate 在初始化的时候调用了beforeCreate,完成了vue实例的生命周期相关属性的初始化以及事件的初始化。这个时候还不能访问数据模型中的data和methods中的方法。created 在初始化完毕之后,完成vue的数据注入以及数据监听操作,该构造的执行意味着vue实例创建完毕,可...
2021-10-08 22:29:33
161
原创 es6新增的基本数据类型——Symbol
ES6引入的一种新的原始数据类型Symbol,表示独一无二的值。Symbol函数可以接受参数,表示对于这个唯一值的描述。属于基本数据类型,Symbol()函数会返回symbol类型的值// 创建symbol值let sy1 = Symbol('hello');let sy2 = Symbol();console.log(sy1 == sy2);// 为了解决冲突let obj = { name: 'zs', age: 12}// 新增属性 修改属性let sy3 = Symbol
2021-09-30 16:24:45
242
原创 js异步代码同步写法
1.回调函数是ES5提供的异步编程解决方案不过这种方法有诸多不利之处,它虽然由我们定义但是执行却依赖于第三方,且逻辑复杂就需要多层回调,不方便使用//异步setTimeout(() => { console.log('setTimeout')}, 0)2.Promise是ES6提供的一种异步编程解决方案,Promise是一个容器,保存着将来才会执行的代码;从语法角度来说Promise是一个对象,可以用来获取异步操作的消息。异步操作,同步解决,避免了层层嵌套的回调
2021-09-29 21:34:05
1346
原创 es5和es6中继承实现的区别
ES5中的继承: 实例使用属性和方法 1.从实例对象本身查找属性或者方法 2.如果实例没有,从构造函数的原型对象中找 3.如果还没有,从父构造函数的原型对象中找function Person(){}Person.prototype={};var p1=new Person();p1.sayName=function(){};p1.sayName(); //p1去调用sayName,自身有访问自身,自身没有访问构造函数原型对象,构造函数原型对象没有去找父构造函数//1.经...
2021-09-28 21:33:40
177
原创 es6的类
在javascript语言中,生成实例对象使用构造函数;ES6提供了类Class这个概念,作为对象的模板。定义一个类通过class关键字,ES6的类可以看成是构造函数的另一种写法。// 1.定义一个类class Person { //静态属性,使用关键字修饰,是私有属性 并不是公共属性 //可以是引用数据类型,也可以是引用数据类型 static weight = '50KG'; // 2.constructor方法是类的默认方法,通过new命令生成对象实...
2021-09-28 21:22:22
149
原创 数组去重的几种方法
1.利用双重for循环来实现let arr = [3,4,1,1,'777','mybody',2,444,'777','mybody'];let unique = (arr) => { for(i = 0;i < arr.length;i++) { for(j = i + 1;j < arr.length;j++){ if(arr[i]==arr[j]) { arr.splice(i,1);
2021-09-27 23:28:46
133
原创 es6新增的声明变量方法
let用于声明一个变量1变量不会提升,即在变量声明之前无法使用该变量2.不可以重复声明3.具有块级作用域,只在当前作用域有效const用于声明一个常量1.变量声明不会被提升,即在变量声明之前无法使用该变量2.不允许重复声明。3.具有局部作用域,即const声明的变量只能在对应代码块中使用4.const声明的变量在声明的时候就需要赋值,并且只能赋值一次,不能修改。...
2021-09-27 23:11:08
219
原创 CommonJS与ES6模块化规范区别
CommonJS var a = {age:12}; a.age = 13 b = a; · 对于基本数据类型,属于复制。即会被模块缓存。同时,在另一个模块可以对该模块输出的变量重新赋值。 · 对于复杂数据类型,属于浅拷贝。由于两个模块引用的对象指向同一个内存空间,因此对该模块的值做修改时会影响另一个模块。 · 当使用require命令加载某个模块时,就会运行整个模块的代码。 · 当使用require命令加载同...
2021-09-27 23:09:23
87
原创 原生ajax请求
AJAX即“AsynchronousJavascriptAndXML”(异步的JavaScript和XML),是指一种创建交互式网页应用的网页开发技术,用于浏览器和服务器之间进行数据交互。1.get无参数 //1.创建实例对象varxhr=newXMLHttpRequest();//2.打开一个连接xhr.open("get",'http://47.93.206.13:8002/index/findAllCat...
2021-09-26 23:15:47
166
原创 画布,拖放,web存储和websocket
画布 canvas 属于html元素 H5新元素 需要结合js 用来绘制图形 在页面上放置一个canvas元素 就相当于放置了一块画布 可以绘制路径 矩形 圆形 字符 图像 属性: width 默认值 300px height 默认值 150px 注意点:canvas需要写闭合标签 <canvas></canvas> 一般不建议使用css设置它的宽高 方法: ...
2021-09-16 21:48:08
214
原创 Navicat for MySQL 1251报错解决方法
主要原因是因为8.0与5.7版本语法不同造成的//将root改成你所要用的用户名1.进入Ubuntu的数据库:mysql-uroot-p2、mysql>usemysql;3、mysql>alteruser'root'@'%'identifiedwithmysql_native_passwordby'你的密码';4、mysql>flushprivileges;...
2021-09-14 15:22:23
174
原创 用jQuery布置项目
AJAX 通过HTTP请求 加载远程数据 这里指的是jQuery对ajax的实现 参数: url String 发送请求的地址 type POST、GET 默认值(GET) PUT DELETE也可以使用 但是兼容性可能不太好 部分浏览器支持 options Object 进行ajax请求的设置 async Boolean 默认值为true代表异步操作 如果你需要同步请求,设置为false,浏览...
2021-09-13 17:05:13
315
原创 jQuery的基本操作
jQuery 是一个快速小巧、功能丰富的第三方JavaScript库 为我们封装了DOM操作 让我们操作dom节点更加方便 打扫屋子 DOM : 扫把扫地 - 直接操作dom节点 jQuery:扫地机器人 吸尘器 - 通过工具操作dom节点 企业框架:佣人 - 不需要我们去操作dom节点 功能: 选取HTML元素 操作HTML元素 CSS操作 操作HTML事件 ......
2021-09-13 16:32:37
114
原创 发送ajax请求方法(get,post)
Ajax Asynchronous JavaScript + XML(异步JavaScript和XML), 其本身不是一种新技术,而是一个用来描述一种使用现有技术集合的‘新’方法. 无刷新获取数据 发送ajax请求:1.创建一个http请求对象var httpRequest = new XMLHttpRequest();var obj = { username:'admin'; password:'123456';}2.准备发送,打开一个http链接//有两...
2021-09-09 21:08:35
308
原创 BOM对象与方法
BOM 浏览器对象模型 BOM里的一个核心对象 window js是单线程的语言,但是我们可以通过超时调用或者间歇调用来调度代码 超时调用 setTimeout() 作用:在指定的毫秒数(时间)后执行函数 参数:两个参数 要执行的函数(必须) ?以毫秒表示的时间(可选 默认 0) 返回值:是一个数字,是当前setTimeout的id,可以通过这个id取消执行 ...
2021-09-09 21:06:36
108
原创 DOM事件
DOM事件: javascript与HTML之间的交互是通过事件实现的。事件就是文档或浏览器窗口中发生的一些特定的交互瞬间。事件三要素:1. 事件目标(event target)发生的事件与之相关联或与之相关的对象2. 事件处理程序(event handler)处理或相应事件的函数3. 事件对象(event object)与特定事件相关且包含有关该事件详细信息的对象事件流(页面接收事件的顺序) 1. 事件冒泡 特点:从内往外传递 ...
2021-09-07 23:40:19
91
原创 js的文档对象模型
DOM树 文档:页面就是文档,在DOM中用document表示 元素:页面标签就是元素,在DOM中用element表示 节点:网页所有内容就是节点(标签、属性、文本、注释等),在DOM中用node表示 DOM把以上内容看作对象 DOM 文档对象模型 js操作html、xml文档的api 1998年10月 IE中的DOM对象是以COM对象的形式实现的 实例化 1. 通过dom拿到我们想要的节点 ...
2021-09-06 22:08:12
70
原创 js创建对象和继承
js创建对象方法 6种1.对象字面量var person = {name : "xyt", age : 21};2.Object构造函数new Object()var person = new Object();person.name = "xyt";person.age = 21;3.工厂模式function newPerson (name, age, gender) { var p = new Object(); p.name = name; p.age = ag...
2021-09-06 22:00:42
100
原创 js的内置对象及内置函数
String类型 length 属性,获取字符串的字符数量 charAt(i) 返回给定位置的字符 charCodeAt(i) 返回指定位置字符的编码 indexOf("x") 从前往后找,查找指定字符所在位置 如果字符不存在,返回-1 有一个数字类型的可选参数,代表从哪个位置开始查找 lastIndexOf("x") 从后往前找,查找字符所在位置 有一个数字类型的可选参数,代表从哪个位置开始查找 concat() ...
2021-09-02 22:51:59
117
TA创建的收藏夹 TA关注的收藏夹
TA关注的人