qq_42238554的博客

原创 vue3父组件需要调用子组件中的方法

父组件需要调用子组件中的方法可以使用ref。

原创 vite网络配置

如果没有进行配置，运行项目之后，看到的访问地址是本地访问地址，其他人访问不了。

原创 a-calendar的日历如何汉化

ant design中的日历默认拿来用时英文的，如何汉化，如下操作，在日历组件外面包一个。

原创 nvm安装node，查看npm版本报错

nvm安装node，使用npm -v报如上图错误，是因为Node版本过高导致，可以降低node版本，使用低一级版本的node.

原创 前端算法总结

1.获取数组中重复的数据。

原创 a-date-picker默认是英文转成中文

a-date-picker默认英文，转换成中文显示

原创 npm运行报错：token ＜ in JSON at position 1 while parsing near

当运行npm run serve时，出现这种错误，解决方法：选择Vscode，然后右键“以管理员方式运行”。

原创 js常用功能

1.随机生成一个颜色值let color=Math.floor(Math.random() * 0xffffff) .toString(16);//输出结果'45c4e3'2.滚动到顶部初学者经常发现自己在正确滚动元素的过程中遇到困难。最简单的滚动元素的方法是使用scrollIntoView方法。添加行为。"smooth "来实现平滑的滚动动画。const scrollToTop = (element) => element.scrollIntoView({ behavior: "sm

原创 flat()方法将多维数组变为一维数组，扁平化数组

flat()将二维数组转换为一维数组。flat() 方法会按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。 flat除了有扁平化嵌套数组之外还可以扁平化空项。实例,将一个二维数组转换为一维数组：let arr=[1,2,[3,4],[5,8],9];let arrnew=arr.flat();console.log(arrnew);//输出结果：[1, 2, 3, 4, 5, 8, 9]实例，使用Infinity将多层次深度数组转换为一维数组l

原创 Object.entries()返回一个给定对象自身可枚举属性的键值对数组,返回的是一个二维数组

Object.entries()Object.entries()方法返回一个给定对象自身可枚举属性的键值对数组，其排列与使用 for…in 循环遍历该对象时返回的顺序一致（区别在于 for-in 循环还会枚举原型链中的属性。输出对象的键值对，返回的是一个二维数组实例：let obj1={a:1,b:2,c:5};let obj2=Object.entries(obj1);console.log(obj2);//输出结果//[['a', 1],['b', 2],['c', 5]]由于Obj

原创 Set对象的详细用法

1.Set对象Set对象可以自动排除重复项，生成Set对象后，可以轻松遍历它所包含的内容。实例，给一个数组去重//现有一个数组let arr=[1,3,1,2,3,4];//把数组转换成Set对象let s=new Set(arr);//Set自动去重，并赋值给变量sconsole.log(s);//Set(4) {1, 3, 2, 4}//此时再把Set对象转换成数组,使用[...]扩展运算符或者使用Array.from()都可以将Set对象转换成数组let newArr=[...s]

原创 Map对象用法

1.Map对象特点：Map是一组键值对的结构，具有极快的查找速度。使用场景：Map主要的应用场景在于数组去重和数据存储。用来存储键值对 Key—Value，注意key不能重复，如果一个key对应多个value，那么后面的会覆盖前面的。使用方法：初始化Map需要一个二维数组，或者直接初始化一个空Map。Map具有以下方法：let m=new Map();//初始化一个空Mapm.set("lisa",90);//添加key和valuem.set("tom",74);console.log(m

原创 js中常用的循环

1.for循环（1）循环数组 let arr = ["lisa", "lili", "sam", "joy"]; for (let i = 0; i < arr.length; i++) { console.log(arr[i]);//输出数组每一个元素 }（2）循环字符串 let arr = "hello"; for (let i = 0; i < arr.length; i++) { console.log(

原创 vue组件之间传值

1.兄弟组件传值使用 $on(event,callback) 监听事件使用 $emit(event, […args]) 触发事件现有子组件a.vue,b.vue，它两是平级，现在要让a组件给b组件传值，a组件中的按钮点击，改变b组件中的值。第一步：新建一个bus.js,并把该js分别引入到a,b组件中//bus.js代码如下import Vue from 'vue'const bus=new Vue();export default bus使用如下方法分别引入到a,b组件中：<s

原创 at()方法可以获取数组倒数第几个参数

.at()方法方法里面的参数放索引。建议在所有基本可索引类，例如：数组、字符串、类数组（arguments）中添加.at（）方法。.at()支持正索引和负索引。例如，针对数组：let arr=[1,2,3,4,5];//获取数组倒数第一个值arr.at(-1);//5//获取数组倒数第二个值arr.at(-2);//4例如，针对字符串let s="hello";//获取字符串倒数第1个字符s.at(-1);//结果是o//获取倒数第2个字符s.at(-2);//结果是l.

原创 oss上传文件遇到的坑

1.如果"ali-oss"版本为6.0以上，那么我们在使用multipartUpload分片上传会遇到很多坑。比如：上传的文件只能小于100kb，否则上传失败，此时我们要对OSS添加useFetch: true可以完美解决，如下是我的配置export function client(data) { //后端提供数据 return new OSS({ region: "oss-cn-hangzhou", accessKeyId: data.accessKeyId, acce

原创 使用Moment.js将系统日期转换为ISO格式

在这里插入图片描述

原创 百度地图接口调用

当我们网站需要调用百度地图接口的时候，可以使用如下方法：1.如何获取经纬度坐标1.打开百度地图，在百度地图最底部找到“地图开放平台”链接。2.进入“百度地图开放平台”网站中，在导航中选择“”开发文档>坐标拾取器“”3.进入“坐标拾取器”系统，点击我们想要的位置，右上角自动显示当期位置的经纬度。javascript API GL当我们要在网页或h5中调用百度地图，我们可以使用“javascript API GL”,文档路径是：“百度地图开放平台>开放文档>web开放>

原创 vue中子父组件传值使用$emit，$on，$off

子组件可以使用 $emit,让父组件监听到自定义事件 。vm.$emit( event, arg ); //触发当前实例上的事件,arg是传递给父组件的参数vm.$on( event, fn );//监听event事件后运行 fn；一、$emit语法1、this $emit（‘自定义事件名’,要传送的数据）；2、触发当前实例上的事件，要传递的数据会传给监听器；实例1：父子组件中各有一个按钮，可以同时操作city在子组件中定义一个city变量，点击按钮可以修改city的值<templa

原创 vue全局注册组件，局部注册组件

1.注册全局组件全局组件可以在任何地方使用，而且不需要进行在单独页面注册。使用方法：第一步：在components文件夹下面建了两个vue组件页面。第二步：在plugin中建一个common.js文件，这个相当于是一个公用js专门用来存储导入的公用组件。代码如下：//把dialog和message组件都导入，install安装并注册组件import dialog from '@/components/dialog.vue'import message from '@/component

原创 vue的生命周期

beforeCreate执行beforeCreate事件钩子；注意：在实例初始化之后，数据观测和事件配置之前被调用，此时组件的选项对象还未创建，el 和 data 并未初始化，因此无法访问methods， data， computed等上的方法和数据。created事件钩子开始执行实例已经创建完成之后被调用，在这一步，实例已完成以下配置：数据观测、属性和方法的运算，watch/event事件回调，完成了data 数据的初始化，el没有。 然而，挂在阶段还没有开始, $el属性目前不可见，这是一个常

原创 vue中filter用法

filters过滤器filters是一个对象，在vue中的表达式如下：filters:{ fun1(v) { ...处理逻辑 return 返回处理后的值; }, fun2(v) { ...处理逻辑 return 返回处理后的值; },}Vue.js 允许你自定义过滤器，可被用于一些常见的文本格式化。过滤器可以用在两个地方：双花括号插值和 v-bind 表达式 (后者从 2.1.0+ 开始支持)。过滤器应该被添加在 JavaScript 表达式的尾部，由“管道”符号指示：

原创 vue.config.js配置，webpack打包配置详解

webpack打包编译我们可以使用npm run build进行编译项目，生成文件，生成后的文件才可以上传到服务器上被服务器识别。如下操作，我们输入npm run build进行编译。编译成功后，我们在文件夹目录中会发现多了一个dist文件夹，里面就是我们编译后的文件，可以直接把这个文件放到服务器中。...

原创 将本地已有的一个项目上传到新建的git仓库中

原创 js深浅拷贝

js中深浅拷贝有哪些方式？（1）遍历赋值(2)Object.create()(3)JSON.parse()和JSON.stringify()什么是深浅拷贝？就是假如B复制了A，当修改A时，看B是否发生变化，如果B也跟着变了，这就是浅拷贝；如果B没变，那就是深拷贝；实例，如下是一个浅拷贝： let a={key:1}; let b=a; b.key=2; console.log(a.key);//输出结果是2,当修改b时，a的key值也被修改了浅拷贝如下例子使用遍历的方式进

原创 数据类型获取及js堆栈使用原理

一、js中有哪些数据类型：(1)原始类型stringnumberbooleanundefinednull(2)引用类型object三大引用类型包括：Object，Array，Function（对象，数组，函数）js堆栈：什么是堆，什么是栈？栈：计算机为原始类型开辟的一块内存空间，string,number…堆：计算机为引用类型开辟的一块内存空间，object对于引用类型的理解：例如：var c={key:1};计算机会给c在栈里面存一个地址值，如[‘x0000123’

原创 vue中子父组件传值使用prop

1.注册公用组件第一种方法（推荐）在main.js中导入，然后注册，代码如下：//导入tableimport table from './components/table'//Vue全局注册tableVue.component('table',table);注册全局组件后，可以再任何页面调用。第二种方法注册公用组件，注册后可以在任何页面使用，而不需要在每个页面重新import导...

原创 常用命名规则

1.变量名变量名推荐使用驼峰法来命名：let firstName;let lastName;变量和函数为小驼峰法标识, 即除第一个单词之外，其他单词首字母大写（ lowerCamelCase)全局变量为大写 (UPPERCASE )常量 (如 PI) 为大写 (UPPERCASE )css命名规则HTML 和 CSS 的横杠(-)字符:HTML5 属性可以以 data- (如：data-quantity, data-price) 作为前缀。CSS 使用 - 来连接属性名 (font

原创 vuex使用教程

Vuex 是什么一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。如下一个简单的单一vue页面，我们可以分别把它看作state,view,actions。state部分就相当于数据源，它要显示到view模块，actions部分相当于用户的一些操作使state数据源发生改变，改变后再映射到view中![在这里插入图片描述](https://img-blog.csdnimg.cn/2021012618075484

原创 js异步编程，同步和异步，阻塞和非阻塞

1.什么是同步，什么是异步？定义：同步和异步关注的是消息通信机制 (synchronous communication/ asynchronous communication)。同步，就是调用某个东西是，调用方得等待这个调用返回结果才能继续往后执行。异步，和同步相反 调用方不会理解得到结果，而是在调用发出后调用者可用继续执行后续操作，被调用者通过状体来通知调用者，或者通过回掉函数来处理这个调用比方说：你去商城买东西，你看上了一款手机，能和店家说你一个这款手机，他就去仓库拿货，你得在店里等着，不能离开，

原创 TypeScript安装与运行

什么是TypeScript？TypeScript是JavaScript的超集，具有可选的类型并可以编译为纯JavaScript。从技术上讲TypeScript就是具有静态类型的JavaScript 。TypeScript 设计目标是开发大型应用，它可以编译成纯 JavaScript，编译出来的JavaScript 可以运行在任何浏览器上。TypeScript 是 JavaScript 的超集，扩展了 JavaScript 的语法，因此现有的 JavaScript 代码可与 TypeScript 一

原创 JAVA继承

基本概念：继承是java面向对象编程技术的一块基石，因为它允许创建分等级层次的类。继承可以理解为一个对象从另一个对象获取属性的过程。如果类A是类B的父类，而类B是类C的父类，我们也称C是A的子类，类C是从类A继承而来的。在Java中，类的继承是单一继承，也就是说，一个子类只能拥有一个父类。继承中最常使用的两个关键字是extends和implements。这两个关键字的使用决定了一个对象和另...

原创 ...rest剩余参数

剩余参数作用：我们知道JS函数内部有个arguments对象，可以拿到全部实参。现在ES6给我们带来了一个新的对象，可以拿到除开始参数外的参数，即剩余参数，这个新的对象和arguments不一样，它是程序员自定义的一个普通标识符，只是需要在前面加上三个点：…如下：function func(a,...rest){ console.log(a); console.log(rest)...

原创 vue目录

v-for列表循环v-if，v-show（条件渲染，显示或隐藏）v-on事件处理（监听事件，事件修饰符）v-model表单绑定，在组件上使用v-modelvue函数(computed，methods，watch，created)组件：（1）组件注册（2）组件传值路由class和style用法vue3.0vue transition过渡效果计算属性：computed侦听属性：watch动态样式：Class与Style绑定条件渲染：v-if,v-else,v-show.

原创 nodejs

node.js的优势？我们为什么要用Node.js呢？NodeJS适合运用在高并发、I/O密集、少量业务逻辑的场景。node.js 为异步而生，这一点毫无疑问，但是在 CPU 和内存发面，要远远落后于 C/C++ 和 Java。特别是对于海量请求的场景，CPU 飙高，内存 GC 缓慢居高不下其特点为：它是一个Javascript运行环境依赖于Chrome V8引擎进行代码解释事件驱动...

原创 vue transition过渡效果

Vue 提供了 transition 的封装组件，在下列情形中，可以给任何元素和组件添加进入/离开过渡:（下列条件如果有变化就会产生transition过渡效果）条件渲染 (使用 v-if)条件展示 (使用 v-show)动态组件组件根节点vue官方动画网址：https://animate.style/调用地址：<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/

原创 Java基础

Java命名规则类名命名要求（首字母大写）：类名必须以英文字母开头，后接字母，数字和下划线的组合习惯以大写字母开头我们注意到class前面有一个public(访问修饰符)，表示class是公开的。然后可以在Hello内部定义若干个方法，上面例子中我们定义了一个main方法。上面例子中我们注意到public不仅可以修饰class，还可以修饰方法。而static是另一个修饰符，表示静态方法，Java入口程序规定的方法必须是静态方法，方法名必须为main,括号内的参数必须是String数组。方法的

原创 小程序：window配置

window配置说明类型：Object是否必填：否描述：全局的默认窗口表现用法：用于设置小程序的状态栏、导航条、标题、窗口背景色。有如下属性值：(1)navigationBarBackgroundColor默认值：#000000描述：导航栏背景颜色，如 #000000(2)navigationBarTextStyle默认值：white描述：导航栏标题颜色，仅支持 ”black“ 和 “white”(3)navigationBarTitleText默认值：无描述：导航栏标题文字内容

原创 微信小程序开发教程

1.目录结构：一个小程序主体由三个文件组成,必须放在项目的根目录:其中：app.js必有(处理小程序逻辑)app.json必有（处理小程序公共配置）app.wxss可有可无（处理小程序公共样式表）使用说明：app.json配置小程序根目录下的 app.json 文件用来对微信小程序进行全局配置，决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。示例：{ ...

原创 小程序sitemap.json

sitemap.jsonsitemap.json文件说明：微信现已开放小程序内搜索，开发者可以通过 sitemap.json 配置，或者管理后台页面收录开关来配置其小程序页面是否允许微信索引。当开发者允许微信索引时，微信会通过爬虫的形式，为小程序的页面内容建立索引。当用户的搜索词条触发该索引时，小程序的页面将可能展示在搜索结果中。 爬虫访问小程序内页面时，会携带特定的 user-agent：mpcrawler 及场景值：1129。需要注意的是，若小程序爬虫发现的页面数据和真实用户的呈现不一致，那么该页面