- 博客(71)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 关于继承的前世今生
目录01. Call 式继承02. Call 式继承的问题03. 原型继承04. 原型继承的问题05. 组合继承06. 寄生继承07. 寄生组合继承08. 优化寄生继承写法09. 继续优化寄生继承写法10. 继续优化寄生继承写法11. Object.create()12. 了解 Object.create() 的第 2 个参数13. 关于 class 中的实例属性、原型属性、静态属性01. Call 式继承又叫借用构造函数继承。funct
2021-12-15 20:53:51
1616
原创 Hooks 进阶
目录useEffect 概念自定义 HookuseRef 操作 DOMuseRef 获取 DOM有三个步骤useRef多次渲染组件时进行数据共享useContext 使用useEffect 概念useEffect 可以返回一个函数这个函数称为清理函数，在此函数内用来执行清理相关的操作（例如事件解绑、清除定时器等）。清理函数的执行时机a，useEffect 的第 2 个参数不写，清理函数会在下一次副作用回调函数调用时以及组件卸载时执行，用于清除上一次或卸载..
2021-12-12 21:19:13
647
原创 Hooks 基础
目录Hooks 是什么为什么要有 HooksHooks 渐进策略useState 基本使用useState 另一种写法useEffect 副作用介绍useEffect 基本使用useEffect 依赖说明useEffect 依赖是一个空数组useEffect 不要对依赖项撒谎useEffect小结Hooks 是什么作用：为函数组件提供状态、生命周期等原本 class 组件中才有的功能，可以理解为通过 Hooks 为函数式组件钩入了 cl...
2021-12-10 19:44:20
750
原创 React 组件进阶
目录特殊的children 属性props 校验生命周期（三大阶段）1.挂载阶段2.更新阶段3.卸载阶段（销毁）4. setState 更新数据的表现特殊的children 属性组件的子节点的本质：会作为组件的 children 属性存在props 校验1.安装并导入prop-types包2.导入import PropTypes from 'prop-types'3.把PropTypes当做静态属性来进行校验export defa...
2021-12-09 20:37:57
569
原创 React 组件通信
目录常见的组件通讯的三种方式（父传子，子传父，兄弟）一 .父传子二. 子传父三 . 兄弟之间的通信四 . 跨层级通信五 . 注意事项：常见的组件通讯的三种方式（父传子，子传父，兄弟）一 .父传子父组件通过自定义属性提供数据子组件接受分为两种：1.类组件接受的通过this.props2.函数式组件 第一个形参，一般写成props二. 子传父使用子传父的三部曲1.父组件里面定义提供修改数据的方法2.子组件调用这个方法同时并传递数据...
2021-12-08 19:52:14
299
原创 React组件基础
目录什么是组件？创建组件的两种方式2.类组件提取组件组件的状态实例属性方法事件绑定this指向的问题，有以下几种方法表单的受控和非受控什么是组件？组件就是页面中的一部分，使用 React 就是在用组件，而所谓的组件化开发就是采用分而治之的思想来管理繁杂的页面逻辑。特点：独立，可复用，可组合创建组件的两种方式1.函数式组件通过函数创建出来的组件，又称简单组件或无状态组件本质上来说就是一个js函数使用的步骤有两步：1.先定义..
2021-12-06 21:03:41
630
原创 实例，原型，静态属性或方法
关于实例，原型，静态属性或方法如下：// 实例、原型、静态属性或方法// 一个函数是不是构造函数：取决于你怎么用/* function App(name) { // 实例属性 this.name = name // 实例方法 this.showName = function () { console.log('Hello') }}const a = new App('ifer')const b = new App('elser')// console.log(
2021-12-06 20:06:50
82
原创 React 初识 和 React 组件基础
一. react背景及它是什么？React起源于 Facebook(Meta) 的内部项目（2011，News Feed），之后又被用来开发网站（2012，Instagram），并于 2013 年 5 月开源。它是一个用于构建用户界面的JavaScript库二. React 特点1.声明式---只需要描述 UI（HTML）看起来是什么样子，就像写 HTML 一样简单，React 内部负责渲染 UI，并在数据变化时自动更新 UI。2.组件化把复杂的页面拆分成一个一个的单元.
2021-12-05 20:56:30
338
原创 移动端的rem布局和VM布局
前言：在开发中我们会遇到ui给我们一套750px 的设计稿，但是我们使用vant组件库开发的话，里面的都是写好了的，它里面的是375px我们要做的是怎么把给的需求完成：1.使用使用rem适配 1安装 amfe-flexible插件 yarn add amfe-flexible npm i amfe-flexible 在main.js导入 import "amfe-flexible" 安装postcss-pxtorem.
2021-11-27 20:47:32
593
原创 vue项目多语言------国际化插件vue-i18n的使用
vue-i18n的使用如下：1：安装 yarn add vue-i18n2:导入 src/lang/index.js import VueI18n from 'vue-i18n'3:注册 import Vue from 'vue' Vue.use(VueI18n)4:实例化 const i18n=new VueI18n({ locale:'当前语言的标识'， // en:英文 zh:中文 messages:{ /...
2021-11-27 20:11:04
654
原创 vue全屏插件screenfull的使用
在我们做项目中会出现要求点击显示全屏的效果，方法如下：screenfull 使用1.安装 yarn add fullscreen@5.0.02.导入import screenfull from 'screenfull'screenfull .toggle() 全屏与非全屏切换在使用的时候判断浏览器支不支持全屏模式支持的话就使用插件screenfull .toggle() 全屏与非全屏切换methods: { // 点击触发全屏的方法 svgClick..
2021-11-27 19:55:02
926
原创 静默刷新的适用场景
适用的场景：适用场景:数据修改,页面未刷新 组件内容的还原，还原以前的数据静默刷新适用场景：数据修改了，页面没更新组件的还原需要刷新的数据 v-if="bol" bol默认为truethis.bol=falsethis.$nextTick(()=>{ this.bol=true})<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" /...
2021-11-26 19:05:41
199
原创 权限管理整个流程
权限管理整个流程# 权限管理整个流程用户管理：帐号的增删改查，为该帐号分配角色角色管理：角色的增删改查，为该角色分配权限数据权限管理：需要进行权限管理的页面进行增删改查权限管理分三部分- api - 主要后端处理， - 前端：响应拦截统一错误处理- 路由 1. 将路由分为二大块 - 静态路由：不需要访问权限的路由 - 动态路由：需要权限访问的路由 - 默认只有静态路由 2. 在获取到用户信息后 1. 用户信息中包含当前用户能访问的权...
2021-11-26 17:35:35
1018
原创 .sync:修饰符的使用
作用：数据双向绑定使用：父子组件传值子组件标签 ：属性名="父组件属性" @update:属性名=“父组件属性=$event”子组件标签 ：属性名.sync="父组件属性"子组件内：props:['属性名']this.$emit('update:属性名'，修改后的值)...
2021-11-24 19:26:45
91
原创 vue-print-nb 的使用---打印指定dom
vue-print-nb 的使用作用：打印指定dom使用： 安装 yarn add vue-print-nb 导入 在main.js导入 import Print from 'vue-print-nb' 注册 Vue.use(Print) 使用 在指定dom加上id id=‘xxx‘ 在按钮上 v-print="{id:'xxx'}" <!-- 用div包着的只打印这部分 -->.
2021-11-24 19:21:13
699
原创 将文本生成二维码
使用： 安装 yarn add qrcode 导入 import Qrcode from 'qrcode' 定义一个canvas标签放二维码 <canvas ref="canvas" /> 生成 Qrcode.toCanvas(需要放置二维码的canvas标签,文本内容,{配制,宽度，高度....}) 如下所示<!-- 点击头像生成二维码 --> <el-dialog tit...
2021-11-24 19:00:05
1147
原创 腾讯云的使用---储存图片
图片的储存有两种方案：1.储存到公司的购买的服务器上优点是：好控制缺点是:成本高，由于都存放在服务器上，占据的空间也很大2.存到第三方的云服务器（腾讯云，阿里云......）各种云有专门的为图片存储提供的云服务器，我们自己的服务器只存储图片地址即可2.1首先是注册一个账号2.2然后是开通对象存储2.3 创建存储桶---在访问权限里面勾选，公有读私有写2.4设置cors规则 在存储桶列表中，选中存储桶2.4.1在左侧的菜单中选安全管理---点击跨域访问CO...
2021-11-24 18:10:59
1840
原创 将数据的中文的key转换成英文的key
目录将数据的中文的key转换成英文的key将时间转换成时间戳将数据的中文的key转换成英文的key我们有时候拿到数据的时候是数据里的key是中文，这个时候有可能会产生乱码的问题以下可以参考下：async onSuccess({ header, results }) { // 将results中数据的中文的key转换成英文的key // 1:列出转换规则 const obj = { 入职日期: 'timeOfEntry',
2021-11-22 22:24:50
588
原创 vue.use 的使用， render里面的h是什么，路由钩子的执行过程
目录Vue.use自动全局注册组件render里面的h是：路由钩子的执行过程组件传值之refVue.useVue.use(js对象/function,参数)js对象：{ install(Vue,options){ // 在Vue.use后，该方法会执行 }}function:function(Vue,options){ // 在Vue.use后，该方法会执行 }// 1.这个是函数的注册// export def...
2021-11-20 20:08:30
930
2
原创 关于watch监听和页码序号的真实渲染
目录watch监听页码序号的真实渲染附加其他的一些常用：watch监听watch:默认侦听栈的变化,基本数据类型都能侦听，复杂数据类型，引用地址改变了它默认可以侦听到使用deep的话堆与栈都能侦听,默认值是false,默认只侦听栈的变化immediate:初次绑定时就立马执行回调，默认是false关于使用如下：export default { data() { return { obj: { a: 10 .
2021-11-19 20:09:52
564
原创 vue组件传值，父子组件双向绑定的使用
目录vue组件传值父子组件之间的双向绑定vue组件传值父子传值 父传子 传 子组件标签 属性名=值 收 props:{ 属性名:{ type:类型，多个类型 [Object,Array,String], default:基本数据类型，直接写 复杂数据类型：()=>{return 复杂数据类型} ...
2021-11-17 19:39:03
313
原创 表单基本验证，token失效，登录回跳的处理，路由的基本使用，等等......
表单验证的基本使用1：el-form model:数据 rules:规则 ref:form用于获取实例对象 el-form-item prop:需要验证项的字段名 label:标题 表单元素 v-model绑定rules:{ prop的值：【 {required:true,message:"必填",trigger:'change/blur'}, {min:最小长度,max:最大长度,m
2021-11-16 18:17:12
1089
原创 js-cookie基本使用
以前我们储存token的话都是使用localStorage，其实还可以使用cookie来储存cookie是存储于访问者计算机中的变量cookie是浏览器提供的一种机制可以由JavaScript对其进行控制(设置、读取、删除)它的使用方法如下：下载yarn add js-cookie导入 import Cookiejs from 'js-cookie'获取： Cookiejs.get(key)设置：Cookiejs.set(key,value)删除：Cookiejs.remo...
2021-11-14 21:28:15
504
原创 mock的基本使用
作用：拦截ajax请求，产生随机数据官网地址：Mock.js使用步骤如下：1:安装mock yarn add mockjs2:导入 import Mock from 'mockjs'3:使用： 功能：拦截ajax请求，产生随机数据 Mock.mock(需要拦截的url地址,{ 产生的随机数据 }) 4:引入 该js main.js引入 import "地址" ------飞哥讲述，然后了...
2021-11-13 23:47:57
752
原创 跨域的几种解决方法
一.首先了解什么是跨域？跨域，指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的也就是说它是浏览器施加的安全保护限制同源是指：协议，域名，端口，三者都相同打个比方：假如一个网址是 http://baidu.com:8080?user=name&pwd=password那么http是协议baidu.com是域名8080就是端口问号后面的是查询字符串user=name&pwd=password 是地址带的参数使用跨域浏览器1...
2021-11-13 23:42:10
80
原创 解决git冲突
在上班的时候，自己现在想提交代码，但是因为一个电话，或者同事的打断，没提交，这个时候，刚好你的同事修改了文件里面的数据，这个时候你把你的事情忙完，再去提交的时候，发现提交的文件已经冲突了，这个时候的解决方法如下：一.顺便回忆下git的使用git 基本使用代码clone:git clone 地址 ，只拉取了主分支代码拉取远程其它分支代码：git checkout -b 分支名 origin/远程分支名git命名 git初始化 git init git提交到暂存：git add ....
2021-11-13 23:18:11
88
原创 vscode操作-用户代码片段的使用方法
一.首先是打开vscode，在里面点击设置，然后点击用户代码片段会出现，新代码片段二.然后点击新代码片段，输入你自己定义的名字，然后会出现如下三.然后就可以在里面开始做你要编辑代码快捷键生成代码片段这是定义的vuex代码片段，如下："Print to vuex": { "prefix": "vuex", "body": [ "const state = {}", "const mutations = {}", "const actions = {}...
2021-11-13 14:28:45
2910
原创 处理base64格式图片和FormData格式的图片
一.处理base64格式这个是截取的做项目的代码片段这个是使用new FileReader()// 2.然后触发里面的change事件，内容发生改变的时候触发 onFileChange (e) { // 然后我们要获取里面的图片的路径值 const files = e.target.files[0] console.log(e, 111) // 这个时候要给判断，如果没有选择的话将图片默认显示和将图片禁用 // 下面是文件大小
2021-11-12 00:25:05
1035
原创 process.env，env.development，.env.production是什么
目录一. process.env 是什么？二. .env.development是什么？三.env.production是什么？一. process.env 是什么？process.env 是 Node.js 中的一个环境对象。process.env可以来访问环境里面定义的变量其中保存着系统的环境的变量信息。可使用 Node.js 命令行工具直接进行查看。二. .env.development是什么？ .env.development开发环境加载的配置文件三.e.
2021-11-12 00:07:39
730
原创 vue请求拦截，响应拦截，路由导航守卫的一些语法和使用场景
目录一.为什么要有请求拦截呢？请求拦截都做了什么?二.什么是响应拦截器？可以做什么？三.什么是路由拦截?为什么要设置路由拦截？一.为什么要有请求拦截呢？请求拦截都做了什么?请求拦截在你发送请求的时候可以做1.比如说你每次发送请求的时候有的请求需要携带token，每次发就会重复这个时候请求拦截就可以在你发请求之前做封装请求头的操作，把需要请求头的存起来2.还可以做的是在你有些时候加载不出来，然后让页面显示正在加载中二.什么是响应拦截器？可以做什么？响应拦截器
2021-11-08 00:04:12
2449
原创 更加方便拿请求数据，和用id删数据
目录1.当我们每次拿数据的时候，数据套几层，怎样更加简便呢？2.以前都是根据id来找索引删数据，怎样用id删数据呢？1.当我们每次拿数据的时候，数据套几层，怎样更加简便呢？ 我们每次请求拿数据，一般会得到res里面有data，data里面还有data，这样一层套一层，拿数据的话会很麻烦，所以我们这时候想到了es6的写法解构，解构还可以双重解构，这样的话拿数据会更加方便如下：{data:data{data}}得到的值是data可以直接拿2.以前都是根据id来找索引.
2021-11-04 23:55:33
100
原创 vuex的四个辅助函数的使用方法
目录1.首先来说使用的步骤以mapState为例：2. 在全局使用mapGetters3.在全局使用mapMutations4.在全局使用mapActions有两个是写computed里面------1.mapGetters 2.mapState还有两个是写methods里面的----1.mapActions 2.mapMutationsvuex的四个辅助函数 mapState,mapActions,mapMutations,mapGetters1.首先来说...
2021-11-02 20:12:56
1311
原创 vuex的五个属性
目录1.state表示的是？2.mutations 表示的是？3.getters 表示的是？4.actions 表示的是5.modules 表示的是首先来说vuex它是专门为vue.js开发的"状态"管理的构架，简单来说也是一个也是一个需要下载的包，也是一个插件可以这样理解简述的话：它是状态管理，集中存储的，管理公共数据的工具 使用场景就在大型项目使用里面有五个内容1.state表示的是？=> 基本数据，相当于是data-----使用的话是$stor..
2021-11-01 23:21:04
85
原创 es6的模块化和node模块化的区别
es6的模块化和node模块化的区别是什么？node模块化是：Node使用CommonJS规范 ,它有四个重要的环境变量：module、exports、require、global。实际使用时，module变量代表当前模块，exports是module的属性，表示对外输出的接口，加载某个模块，实际上是加载该模块的module.exports属性。用require加载模块（同步）。Node为每隔模块提供了一个exports变量，指向module.exports，这等同于每个模块头部有这样的一行代码：
2021-10-31 22:08:55
957
原创 路由，声明式导航，编程式导航
目录1.前端的路由是什么？优点是什么，使用步骤？2.声明式导航和编程式导航的区别1.前端的路由是什么？优点是什么，使用步骤？路径和组件的映射关系优点是：单页面应用整体不刷新页面，用户体验更好数据传递容易，开发效率高使用路由的几个步骤是？1.引入vue文件2.导入路由 vue router3.使用vue router插件，把它注册到全局 vue.use4.创建路由规则数组5.创建路由规则对象-传入规则，也就是传入第四步6.然后就是默认导出7.再到main.js.
2021-10-30 23:15:12
2232
原创 关于同步，异步，定位等一些问题
目录1.第一次页面加载会触发哪几个钩子？DOM 渲染在哪个周期中就已经完成？2.position中absolute和fixed区别？3.vue中 keep-alive 组件的作用，及触发的钩子函数是哪两个？4.常见服务器响应状态码分别代表什么（1-5开头的不细分）5.history方法有哪些，都有什么作用？6.同步异步执行机制1.第一次页面加载会触发哪几个钩子？DOM 渲染在哪个周期中就已经完成？会触发 初始化前，初始化后，挂载前，挂载后下面这几个beforeCreat.
2021-10-29 18:06:31
173
原创 原型链，axios，vue生命周期等一些问题的简答
目录1.http 和 https 的区别是什么？2.ajax 的缺点？3.Js 的原型和原型链？原型链的应用？4.vue生命周期有那些？说说作用5.axios特点6.同步和异步区别 1.http 和 https 的区别是什么？http是超文本传输协议，信息是明文传输，https则是具有安全性的ssl/tls加密传输协议。http和https使用的是完全不同的连接方式，用的端口也不一样，前者是80，后者是443。http的连接很简单，是无状态的；HTTPS协议是由S..
2021-10-27 22:00:40
155
原创 在同一个模板里面是不能出现相同key值的
今天写案例然后在一个模板下循环了两次，然后加了两次相同key，所以出现下面的报错解决的方法是：在vue中，同一组件中兄弟元素之间使用for循环遍历数组，每一个for的key值不能使用下标来表示，不然这样会出现以上这样的错误，也就是出现重复键的问题：可以使用给每个可以加上一定的数值或字符来标记不同例：index+10 或者 index+'r'---------- for会给每个数组添加唯一的表示id --------...
2021-10-26 21:39:48
234
原创 今日的问题
钩子函数不用手动触发el选项vue实例编译后模板挂载到index.html的id叫APP的标签上-----就是你需要把它挂载到哪个盒子上------------------------------提问-----------------------------1.1.Vue 组件 data 为什么必须是函数如果data是一个函数的话，这样每复用一次组件，就会返回一份新的data，类似于给每个组件实例创建一个私有的数据空间，让各个组件实例维护各自的数据。而单纯的写成对象形式，就使得所有组件实例共用
2021-10-26 18:16:44
46
原创 vue的一些生命周期钩子函数
vue有哪些生命周期钩子函数？一共有八种命周期函数：四大阶段 八大方法-----------总共分为8个阶段。创建前/后，载入前/后，更新前/后，销毁前/后。----------1.初始化之前beforeCreate(实例创建前) ---这个时候this还不能使用，data中的数据、methods中的方法，以及watcher中的事件都不能获得。2.初始化之后created(实例创建后)---这个时候可以操作vue中的数据和方法，但是还不能对dom节点进行操作。3....
2021-10-25 18:39:17
530
空空如也
怎么解决视频软件登录不上去
2021-10-20
TA创建的收藏夹 TA关注的收藏夹
TA关注的人