- 博客(38)
- 收藏
- 关注
原创 Mac 每次都要执行source ~/.bash_profile 解决办法
②最后一行输入(文件里可能没有内容)source~/.bash_profile。1、去zshrc文件里最后一行加上source~/.bash_profile。③、esc+shift+——>输入wq保存编辑的内容——>回车。这样以后就不用每次都source~
2022-07-28 17:34:29
2910
2
原创 vue3.2基本认识
一,不需要return在vue3.0中 你在script中写的变量,你要是在template中拿到,你想要return出去才可以,而vue3.2升级之后他并不需要,<template> {{ num }} </template><script setup lang="ts">import { onMounted, ref, watch } from "vue"let num = ref<number>(1);</script>
2022-02-09 17:31:03
1181
原创 js 简单修改数组的push forEach方法
其实很多IT前端好友们都只会用一些js给提供的API 数组啊对象啊,会用归会用,想要自己成长的话一定要知道里面的原理,以及使用方法,这样才会提高自己,下面就是我简单的实现了数组的push方法 和 forEach方法 你们可以借鉴一下然后 打开你们的思路,代码如下:数组push的Api: let arr = [1, 2, 3, 4] arr.push(10, 11, 12) //这是正常的push方法//[1, 2, 3, 4, 10, 11, 12] 打印结果自己写的: le.
2021-12-24 22:44:54
1350
原创 js中‘==’和‘===’的区别 详解
看一下代码打印结果: console.log(1 == true); //true console.log(undefined == null) //true console.log(1 == '1'); //true console.log([1, 2, 3] == '1,2,3'); //true你们会发现,他们都是true,为什么会这样的 这就涉及到原理了,其实==它比较的是值 只要值相同他就是true,而以上情况会涉及到一个Object的一个方法 然后形.
2021-12-22 23:54:58
427
原创 react 高阶组件
一. 什么是高阶组件高阶组件. 高阶组件(HOC)是 React 中用于复用组件逻辑的一种高级技巧。. HOC 自身不是 React API 的一部分,它是一种基于 React 的组合特性而形成的设计模式这是官网解释 其实很多人会很懵逼 什么是HOC 大家都没听说过 那大家听说过HOF把 HOF就是我们常用的高阶函数 什么是高阶函数 就是你传的参数是一个函数 或者返回的是一个函数,比如常用的forEach() ,map(),sort() 计时器等等 这些参数都是一个函数 对把 这就是简单...
2021-12-21 11:22:52
91
原创 如何再React项目中使用动态的背景效果
就像这样的 已进入页面等 就会发现有很多动态的背景啊 粒子效果啊 很多 其实这就是一个插件再github官网上 搜索react-particle地址:Search · react-particle · GitHub进来之后下载你需要的版本 以及样式 其中 他给你了很多中样式 但是要靠后期你自己去选择相对应得样式 就可以有好看的样式啦 按照人家里面给的方法 下载引入模块就好啦...
2021-12-20 09:04:51
1229
原创 如何在react中使用redux
安装命令:yarn add react-redux 或者 npm i react-redux --savenpm i redux --save这里不需要异步的话 就不需要再安装了首先 你创建一个redux的专属文件夹 应为 redux是js的库 他并不是react的 只是可以和他react配合使用 所以,你尽量为了代码的规范 创建一个专属的文件夹当然文件你随便起名字,你在文件里首先先引入他的方法createStore是创建一个初始化仓库combineReduce...
2021-12-19 19:24:15
488
原创 React报错 React Hook useEffect has a missing dependency: ‘obj‘
在使用useEffect时,当我们将函数的声明放在useEffect函数外面时或者使用useState定义的历史变量,会报eslint警告可以加上eslint-disable-line标注释就可以
2021-12-17 15:13:46
1295
原创 如何自己手动封装一个正则验证
都知道 如果在一个大项目中 很多都会用到正则,但是正则一个一个写回很麻烦 所以我就自己手动封装了一个 正则 我这里呢只是封装一个方法 里面的正则的话 可以自行添加正则大全首先在你的项目中 你自己建立文件夹 自己手动创建工具文件夹 随便自己起名字 testInp(name, val) { val = val.trim() let obj = { mobile: /^(13[0-9]|14[5|7]|15[0|1|2|3|5|6|7|8|9]|18[0|1|2|3|5|6|7|...
2021-12-17 14:56:50
365
原创 小程序优化方案
1,控制包的大小控制包大小:上传代码时要先进行压缩、静态图片资源除小的icon外其余放到cdn、无用代码清除;分包加载:根据业务场景,将用户访问率高的页面放在主包里,将访问率低的页面放入子包里,按需加载;分包预加载:在进入小程序某个页面时,由框架自动预下载可能需要的分包,提升进入后续分包页面时的启动速度。对于独立分包,也可以预下载主包。分包预下载 官方文档链接独立分包技术:区别于子包,和主包之间是无关的,在功能比较独立的子包里,使用户只需下载分包资源;独立分包 官方文档链接2.减少对this.
2021-12-13 19:37:35
535
原创 es6 中Map 和Set 的区别
Map为了使用Number或者其他数据类型作为键,ES6规范引入了新的数据类型Map。Map是一组键值对的结构,具有极快的查找速度。初始化Map需要一个二维数组,或者直接初始化一个空Map由于一个key只能对应一个value,所以多次对一个key放入value,后面的值会把前面的值冲掉var m = new Map();m.set('Adam', 67);m.set('Adam', 88);m.get('Adam'); // 88他主要是用于对象Set他的应用场景就是用.
2021-12-13 19:14:55
510
原创 Vue3组件同步更新 update 方法 和Vue2.sync的用法
有一篇文章我用到了这个update来向父组组件传参 那么这个是干啥的 ,其实通俗易懂一点 他就是用来同步更新父组件的值 不需要再用父组件来调用自定义事件 实例:vue3版本<template> <div class=""> <p @click="open">请你点击</p> <zh-drag v-model:show="show" title="头部"> <template #center> 中
2021-12-13 19:07:37
8510
1
原创 vue3 组件传值 Name属性 以及 组件递归
1. 父传子 (这里就用element-ui 中递归菜单来演示)首先 先引入子组件 并注册这里路径自己别写错了 注意 如果你是按照我发布过全局注册来实现的话 你就不用components了 直接页面使用 节省代码量 最关键用自定义属性的方式 来传递值给子组件子组件来接收 注意:我这里是简写,如果你也想拥有 React 中propTypes的功能的话 Vue也有你可以这样写 来指定类型 default意思是 如果你不传 就是默认 这个值子组件接收上面接收了 注...
2021-12-13 18:58:33
2141
原创 vue Router 和 Route的区别是什么 以及 params和qurey
RouterRouter对象是全局路由的实例,是router构造方法的实例,他主要是用来跳转路径其中的方法有push():注意:push方法的跳转会向 history 栈添加一个新的记录,当我们点击浏览器的返回按钮时可以看到之前的页面。go(): 主要用于返回上一级的路径replace() :push方法会向 history 栈添加一个新的记录,而replace方法是替换当前的页面,不会向 history 栈添加一个新的记录如果学过React的帖子们 应该都知道push .
2021-12-13 18:30:29
250
原创 大屏可视化的制作过程 echarts
这里我用的是 echarts首先 你可以去他的官网里 去安装包 如果不想的话 可以直接复制npm install echarts --save给东西要给全 地址:Apache ECharts操作其实很简单 如果你用的是 js 想尝试尝试 你就可以直接去他的实例里面去找左边代码一复制 哎 你就会发现 出现了这里是他的配置项 就和你的玩具一样把 它可以配置什么啊 等等 这里面都可以找到 你就可以按照他里面给你的东西 你就可以对你的图标来操作 变成Boss想要的样子...
2021-12-13 17:20:06
676
原创 实现重复数组或者字符串中 出现最多的数 和次数
var arr = [1, 2, 3, 1, 2, 4]; var newarr3 = new Array(5); console.log(newarr3); function arrayCnt(arr) { var newArr = []; //使用set进行数组去重 newArr = [...new Set(arr)]; var newarr2 = ne...
2021-12-13 17:01:41
138
原创 js异步 同步 微宏任务
先看下面一串代码 async function async1() { console.log('async1 start') await async2() console.log('async1 end') } async function async2() { console.log( 'async2') } cons
2021-12-13 16:56:16
584
原创 uniapp 清除缓存
created() { // #ifdef APP-PLUS this.formatSize() // #endif},methods: { formatSize() { let that = this; plus.cache.calculate(function(size) { let sizeCache = parseInt(size); if (sizeCache == 0) { that.fileSizeString =.
2021-12-08 20:58:50
2733
原创 服务器请求状态码
http各个状态码的含义:由三位数字组成,主要是由第一位数字定义状态码的类型2开头:(请求成功)表示成功处理了请求的状态代码 200:(成功)服务器已成功处理了请求。通常,这表示服务器提供了请求的网页。 201:(已创建)请求成功并且服务器创建了新的资源 202:(已接受)服务器已接受请求,但尚未处理 203:(非授权信息)服务器已成功处理了请求,但返回的信息可能来自另一资源。 204:(无内容)服务器成功处理了请求,但没有返回任何内容 205:(重置内容)服务器成功处理了请求,但没有返回.
2021-12-07 14:28:16
679
原创 vue2 ,vue3 全局挂载
在vue2中挂载其实很简单 就是在vue的prototype上 也就是原型上 直接来挂载 在main.js中import Vue from "vue";import Echarts from "echarts";Vue.prototype.$echarts = Echarts;new Vue({ router, store, render: (h) => h(App),}).$mount("#app");在页面使用的时候this.$echarts.xxx()就可
2021-12-02 20:56:43
1191
原创 小程序自定义tabBar
. 配置信息在app.json中的tabBar项指定custom字段,同时其余tabBar相关配置也补充完整。 { "tabBar": { "custom": true, //改为true "color": "#000000", "selectedColor": "#000000", "backgroundColor": "#000000", "list": [{ "pagePath": "page/compone...
2021-12-02 20:44:21
386
原创 js字符串常用的方法
var str="hello world"; console.log(str.slice(3));//lo world console.log(str.substring(3));//lo world console.log(str.substr(3));//lo world console.log(str.slice(3,7));//lo w 7表示子字符串最后一个字符后面的位置 简单理解就是包含头不包含尾 console.log(str.subst...
2021-12-02 20:36:42
78
原创 原生面向对象实现拖拽
一 ,什么是面向对象1.首先,js面向对象是一种思想;2.其次,遵循万物皆对象的准则;程序中的关键模块都可以视为对象,对象都是由属性和方法组成,属性可以理解为对象的特征,是静态的,方法可以理解为对象的行为,是动态的;例如,在汽车这个对象中,他的颜色,型号,大小就是他的属性,而行驶则是他的方法;3.面向对象会使用对象的属性和方法,它不关注内部的细节和过程;同时也会构造对象。就像我们说的 一般new 出来的 都是面向对象 比如 new Date()new XMLHttpRequest()等.
2021-12-01 21:24:24
239
原创 原生ajax请求
XMLHttpRequest 对象 XMLHttpRequest对象是ajax的基础,XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。目前所有浏览器都支持XMLHttpRequest什么是ajax ajax的出现,刚好解决了传统方法的缺陷。AJAX 是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更
2021-12-01 21:14:31
509
原创 关于promise的封装 async 和 await
一 ,什么是promise这个是es6新增的一个方法 它的出现是为了让异步变为同步,解决回调地狱二,如何使用它主要是三个状态 成功,失败,和等待 简单来说 就是它里面都有各自的回调函数 成功的使用resolve将其抛出 ,失败是由reject 将其曝出,所以在外面我们就可以用.then 和 . catch获得我们抛出的数据export const chinaHttp = new Promise((resolve, reject) => { $.ajax({ ..
2021-12-01 21:11:08
819
原创 echarts 折线图设置背景图
设置echarts折线图颜色渐变,配置areaStyle即可:option = { title: { text: '折线图颜色渐变' }, tooltip: { trigger: 'axis' }, grid: { left: '3%', right: '4%', bottom: '3%', containLabel: false }, toolbox:...
2021-12-01 16:53:06
4037
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人