- 博客(33)
- 问答 (3)
- 收藏
- 关注
原创 React Hooks 使用总结
useTransition 执行返回一个数组。数组有两个状态值:第一个是,当处于过渡状态的标志——isPending。第二个是一个方法,可以理解为上述的 startTransition。可以把里面的更新任务变成过渡任务。
2022-08-18 17:52:04 1341 1
原创 微信小程序之组件的四种传值方式
我们可以利用微信小程序提供的本地存储 wx.setStorageSync 与 wx.getStorageSync 进行传值。 传递组件接收组件2. 使用路由传递数据传递组件 接收组件这时因为传递的是对象类型的数据,到另一个页面获取时会发现是"[object,object]",解决方法是利用JSON.stringify()和JSON.parse()传递数据的组件接收数据的组件若是数据中有特殊字符在内,微信中提供的api encodeURIComponent() 和 de
2022-05-28 15:35:30 12741 4
原创 js变量及数据类型
个人复习:一、关于console调试常用方法console.log("normal"); // 用于输出普通信息console.dir('inspect'); //用于对一个对象进行检查,并以易于阅读和打印的格式显示console.info("information"); // 用于输出提示性信息console.error("error"); // 用于输出错误信息console.warn("warn"); ...
2022-05-25 15:24:42 522
原创 async await 是什么?它有哪些作用?
async await 是es7里面的新语法、它的作用就是 async 用于申明一个 function 是异步的,而 await 用于等待一个异步方法执行完成。它可以很好的替代promise 中的thenasync函数返回一个 Promise 对象,可以使用then方法添加回调函数。当函数执行的时候,一旦遇到await就会先返回,等到异步操作完成,再接着执行函数体内后面的语句。...
2022-04-28 09:03:30 2888 1
原创 简介react-router-dom基本使用
React Router附带了一些HOOK,可让您访问路由器的状态并从组件内部执行导航,例如useHistoryuseLocationuseParamsuseRouteMatch
2022-04-26 17:53:33 1556
原创 提升代码质量的最新js小技巧
1. ??用于判断运算符左侧的值为null或undefined时,返回右侧的值在ES2020 引入的 ?? 运算符,也被称为null判断运算符( Nullish coalescing operator)它的行为类似||,但是更严,||运算符是左边是空字符串或false或0等falsy值,都会返回后侧的值。而??必须运算符左侧的值为null或undefined时,才会返回右侧的值。因此 0||1 // 10??1 // 0const data = { isNu...
2022-04-09 15:05:10 1450
原创 CSS文本超出部分利用省略代替
如何在CSS中文本超出隐藏,我们可以使用overflow:hidden来隐藏以及CSS中的text-overflow属性给隐藏部分添加省略号
2022-01-24 10:30:11 1799
原创 React中setState方法详解
一、为什么要使用 setState 方法,如何用? 在 React 中,组件分为 有状态组件 和 无状态组件,有状态组件就是能够定义 state 的组件,比如类组件,无状态组件反之,比如函数组件。state 就是用来描述事物在某时刻的数据,可以被改变,改变后与视图相映射,用来保存数据和响应视图。 虽然状态可以改变,但不是响应式的,动态改变并没有与视图响应,想要改变并响应视图则需要 setState 修改并更新视图。 使用方法:this.setState...
2021-12-10 20:12:53 10552 1
原创 前端如何实现权限管理板块的流程和思想
一、什么是权限管理 权限管理是指一个角色(如vip和非vip)在一个系统中只能使用指定的功能并且只能访问指定的界面,权限管理是一个项目当中必不可少的部分。二、如何做到权限管理功能注意: 新版Vue Router中用router.addRoute来替代原有的router.addRoutes来动态添加路由、子路由。路由分为两块:不需要权限访问的路由,比如登录页面、404页面,有时首页也不需要。 需要权限访问的路由 用户登录后后端会返回一个当前用...
2021-12-07 16:20:02 6782 4
原创 Vue 中 $attrs 与 $listeners 的详解
介绍$attrs继承所有的父组件属性(没有通过 props 接收的属性还有 class 类名 和 style 样式 )。inheritAttrs:是否非 props 属性显示在标签最外层,默认值true ,就是继承所有的父组件属性(除了 props 特定绑定外)作为普通的HTML特性应用在子组件的根元素上,如果你不希望组件的根元素继承特性就设置 inheritAttrs: false ,但是 class 还是会继承。$listeners它是一个对象,能接收所有的方法绑定,里面包含..
2021-11-28 17:32:17 3195 1
原创 如何自动注册全局组件 (Vue.use正确使用)
在components中创建lib文件夹index.js:export default { // 通过Vue.use调用相应的方法对象,调用它的install方法 install(Vue, options) { // 自动全局注册组件 // 1.读取lib文件夹下的文件 // const req=require.context('路径','是否读取子文件夹','正则匹配') const req = require.context('./', true, /\
2021-11-25 15:35:42 1357 1
原创 vue实现二维码生成(qrcode)
安装:npm i qrcode作用:将文本生成二维码使用: 导入 import Qrcode from 'qrcode' 定义一个canvas画布标签来放置二维码 <canvas ref="canvas" /> 生成 Qrcode.toCanvas(需要放置二维码的canvas标签,文本内容,{配制项(样式),宽度,高度....}) ...
2021-11-24 20:13:40 1430
原创 Vue中render函数浅浅详解
render介绍 众所周知,仅限于我大前端,Vue中的核心就是虚拟DOM。 通常我们都会把我们的页面结构逻辑都写在 template 中,然后再通过vue将我们的代码转换成虚拟DOM,相比于真实DOM,虚拟DOM是通过js代码处理的,所以消耗的性能相对较小,当然大部分情况下使用 template 创建我们的HTML是可以的,但是在有些场景下,我们真的需要通过Javascript的完全编程的能力来完成时,就可以用到 render函数,比之 template 更接近编译器。........
2021-11-21 17:48:57 8207 4
原创 CommonJS模块与ES6模块及区别
CommonJS模块和ES6模块在ES6之前,js本没有模块体系之说,最主要使用的是CommonJS和AMD两种。前者用于服务器,后者用于浏览器,ES6后在语言标准的层面上实现了模块功能,使用简单,称为浏览器和服务器通用的模块解决方案。CommonJS模块化规范Node.js 遵循了 CommonJS 模块化规范,CommonJS 规定了模块的特性和各模块之间如何相互依赖,规定每个模块内部,规定 module 变量代表当前模块,module 变量是一个对象,它的 ...
2021-11-18 16:53:56 2232 1
原创 Vue指令介绍及使用
一、什么是指令 在 vue 中提供了些对页面和数据更方便的输出方式,实质上就是特殊的 html 标签属性,指令中封装了一些DOM行为, 结合属性作为一个行为, 行为有对应的值,根据不同的值,框架会进行相关DOM操作的绑定, 特点: v- 开头。二、插值表达式 在dom标签中直接插入内容,又叫声明式渲染/文本插值。语法:{{ 表达式 }} 注意:dom中插值表达式赋值, vue的变量必须在data里声明三、vue中常用 v-...
2021-11-06 16:50:36 2548
原创 js中常用的字符串中方法总结及详解
一、字符串特性 在JavaScript中, 字符串 的值是 不可变的,意思就是一旦字符串被创建,其内部是不能被改变的,例如:let str = 'csdn';str[0] = 'ss';这是不能够实现的,只能通过重新赋值的方式来改变变量,just like thislet str = 'csdn';str = 'automan';console.log(str); // automan注意:尽量不要大量拼接字符串,占内存。二、常用字符串方法 ch...
2021-10-31 15:37:00 335
原创 Vue生命周期详解
一、生命周期的概念生命周期,顾名思义就是一个vue组件从 创建 到 销毁 的过程。二、钩子函数 Vue中有许多内置函数,是随着组件生命周期阶段自动执行的。我们可以通过钩子函数来在特定的某个生命周期的阶段执行特定的操作,比如能够在 created 中发起 ajax 请求,从而能够初始化 data 数据渲染页面。 生命周期可以分为四个阶段:初始化阶段 挂载阶段 更新阶段 销毁阶段 每个阶段又有相对应的方法,分别为:...
2021-10-27 22:02:09 3165
原创 总结js数组的方法介绍及应用
一、常用数组方法 ES5常用 方法名 功能 是否会改变原数组 返回值 push() 向数组末尾添加一个或多个元素 是 返回新的数组长度 unshift() 向数组开头添加一个或多个元素 是 返回新的数组长度 pop() 删除最后一个元素 是 返回被删除的元素 shift() 删除第一个元素 是 返回被删除的元素 reverse() 翻转数组里的元素 是 返回翻转后的数组
2021-10-24 15:34:51 827 1
原创 Vue中diff算法详解
首先带大家了解一下虚拟DOM概念一、本质虚拟DOM本质就是一个js对象,用来保存DOM关键信息。二、概念后缀名为.vue文件中的 template 里写的标签,都是模板,都会被vue处理成虚拟DOM对象来渲染显示在浏览器(真实dom页面)上。内存中生成一样的虚拟DOM结构 项目中的DOM属性有很多个,我们无法很快知道什么属性改变,比如在template中的标签结构为: <template> <di...
2021-10-22 18:21:44 3168
原创 webpack简单实用说明及应用
首先小huihui推荐使用 yarn 包管理器,与 npm 类似,可用于下载包,优点就是更快,安全可靠。详情见官网:Yarn 中文文档下载见:安装 | Yarn 中文文档==不要安到带中文的路径下, 建议在C盘/==一、webpack基本概念就是 node 的一个第三方模块包,用于打包代码。详见官网:webpackwebpack能做什么? 把很多个文件打包整合在一起,缩小项目的体积,提高加载速度。 功能支持所有类型文件的打包 支持less/sass=>css 支持..
2021-10-17 21:41:23 694 1
原创 总结JS继承的六种方式
1. 继承1.1语法//父类 classFather{ }//子类继承父类 classSonextendsFather{ }例如:classFather{ constructor(sonname){ this.sonname=sonname; } say(){ console.log('你的姓是'+this.sonname); ...
2021-10-15 14:28:50 13703 3
原创 基于npm的bcrypt加密详解
为了保证密码的安全性,不建议在数据库以明文的形式保存用户密码,推荐对密码进行加密存储。1.在所需项目中,使用bcryptjs对用户密码进行加密,优点:加密之后的密码,无法被逆向破解 同一明文密码多次加密,得到的加密结果各不相同,保证了安全性2.安装并配置 bcryptjsbcryptjs详见 :bcryptjs - npm2.1 在所需项目文件中打开终端写入下面命令安装npm i bcryptjs2.2 导入 bcr...
2021-10-13 22:10:06 1981 3
原创 教教大家如何一天学会MySQL的增删减改
目录数据库简介一、MySQL简介二、 MySQL安装及配置三、数据库列的类型3.1数值类型3.2日期/时间 3.3 字符串类型数据库简介概念:数据库(database)是用来组织、存储和管理数据的仓库。 目的:为了方便管理互联网世界中的数据,就有了数据库管理系统的概念(简称:数据库)。用户可以对数据库中的数据进行新增、查询、更新、删除等操作。 常见数据库工具: MySQL 数据库(目前使用最广泛、流行度最...
2021-10-11 21:08:25 372 4
原创 总结HTTP协议详解
概述什么是协议,协议就像是我们租房或者工作时所签订的合同,就是事先说明的一种规范,约定,标准 。HTTP协议(HyperText Transfer Protocol):又称超文本传输协议,客户端(浏览器端)与WEB服务器端之间的交互协议。当浏览器和服务器进行数据交换时,html文件、图片、CSS、JS等都是基于HTTP协议进行交互传输的。HTTP协议目前使用的基本都是1.1版本(版本详情见:http协议各版本差异_gcs的博客-CSDN博客_http协议版本)特点:通常是基..
2021-10-10 19:49:48 1802 2
原创 关于Git的分支的创建与介绍
其他Git内容详尽请见:Git史上最详细教程(详细图解)_m0_48651355的博客-CSDN博客啥子是git分支呢?大家可以这么理解,如果你看过盗梦空间或者你是个漫威迷的话,应该听说过平行宇宙或者多层宇宙,就是当前宇宙不会影响到其他的平行宇宙,正如当我们创建了新的分支,在新分支里面不论做什么事都不会影响到主分支上的内容。只有当触发了什么时空乱流啊之类的就相当于主分支和次分支合并才会使主分支内容改变。分支有什么作用?当你准备开发一个新功能,但是需要花很长时间才能完成,第一次你写了一部分的.
2021-10-08 21:18:40 2063 2
原创 仅在上一个厕所时间了解 关于动画
1.filter属性定义了元素(通常是<img>)的可视效果(例如:模糊与饱和度)filter: none | blur() | brightness() | contrast() | drop-shadow() | grayscale() | hue-rotate() | invert() | opacity() | saturate() | sepia() | url();提示:使用空格分隔多个滤镜。注意:滤镜通常使用百分比 (如:75%), 当然也可以使用...
2021-10-08 15:58:18 211
原创 必要:学会发个包到npm
1.什么是包?Node.js的第三方模块又叫做包,不像自定义模块和内置模块,包是由第三方就个人或者是一个团队研发的,免费且开源。npm网站:npm。2.下载和使用npm包现在只要下载 node.js 就会附带安装 npm ,可以在终端执行 npm -v 来查询自己安装的 npm 包版本。//项目中安装包的命令npm install 包名 或者 npm i 包名//安装指定版本包npm i 包名@版本号//安装多个包npm i 包名1 包名23.初次装包完成后新增的...
2021-10-07 21:55:39 297 2
原创 如何仅在一个上厕所时间入门了前端
1.<img src="图像地址" /> src 是属性,用于指定图片的路径 alt 替换文本 图像显示不出来时用文字替换 title 提示文本 鼠标放在图片上显示信息2.<a href="javascript:;" target="目标窗口弹出的方式">文本或图片 </a> target="_blank":开始一个新窗口打开页面,"_self":默认,当前窗口打开页面。3.锚点链接:快速定位到页面中的某个所需位置...
2021-10-07 20:06:39 237
原创 对于模块化简单介绍
概念把代码从上而下一一整理成许多板块,使代码能够组合、拆分和更换且不影响正常的实现运行。好处a .可维护性1、灵活架构,焦点分离2、方便模块间组合、分解3、方便单个模块功能调试、升级4、多人协作互不干扰b .可复用性c. 可实现按需加载缺点:性能损耗1、系统分层,调用链会很长2、模块间发送消息会很耗性能node.js中模块的分类内置模块:fs、path、http等自定义模块: 我们创建的每一个.js后缀的文件都是自定义模...
2021-10-06 19:46:00 382
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人