- 博客(17)
- 收藏
- 关注
RSS订阅原创 宏任务与微任务
JavaScript是单线程语言，在同一时间只能做一件事，为了防止主线程的拥挤，事件循环应运而生。这样也就产生了同步任务和异步任务。同步任务：不需要等待就可以立即看到执行结果，如console.log(),异步任务：需要等待一些时间才可以看到执行结果，如setTimeout,setInterval事件循环在执行中，同步任务进入主线程，异步的进入Event Table中并注册函数，当指定事情完成之后Event Table会将这个函数移入Event Queue，主线程内容执行完成之后会去Even
2022-05-30 15:45:00
167
原创 vue的异步数据更新机制与$nextTick
vue异步更新domvue的响应式更新dom是异步执行的，不是数据发生变化之后dom立即发生变化，而是按照一定的逻辑更新dom。具体是vue在检测到数据变化时，vue将开启一个队列，，并缓冲在同一事件循环中发生的所有数据变更。如果同一个 watcher 被多次触发，只会被推入到队列中一次。这在缓冲中去除重复数据造成的额外的dom操作和计算是非常必要的。在下一个nextTick中，vue执行的是已经去重的实际工作。理解：vue执行dom更新时异步的，这个异步任务可以当成是一个promise的微任务
2022-05-30 14:26:41
1624
原创 vite+vue3中使用mock模拟数据
1.安装mockjs和vite-plugin-mocknpm i mockjs vite-plugin-mock --save-dev2.在vite.config.ts文件中配置vite-plugin-mock使用方式import { defineConfig } from 'vite'import vue from '@vitejs/plugin-vue'import { viteMockServe } from 'vite-plugin-mock'// https://vitej
2022-05-14 15:25:25
5976
2
原创 Vue3中使用reactive时，后端有返回数据但dom没有更新
问题：在Vue3的setup中使用reactive更新数据，但是dom没有更新问题：代码：<template> <div class="aside"> <div class="collpase-btn" @click="collpaseMenu"> <el-icon><fold /></el-icon> </div> <el-me
2022-05-09 15:02:06
4699
原创 react中使用ant组件库的modal弹窗报错
在react项目中使用ant-design库中的modal弹窗控制台报错findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of DomWrapper3 which is inside StrictMode.问题根因：react脚手架中开启了严格模式，限制代码书写规范。在ant-design组件库中使用了CSSTransition，但是CSSTransition中的部分代码的写法对于react
2022-05-06 16:06:44
1845
原创 css 中的单位
css中有常用的单位，如px，em，rem，vw，vh等，总结一下各自的区别1.px（像素）px是绝对单位，代表屏幕中每个「点」（pixel）2.emem是相对单位，是每个子元素相对于父元素的px值。如果父元素是16px，设置子元素为2em，则元素的大小为32px。3.remrem是相对元素，是相对于根元素的px值。如果HTML的大小为16px，设置为2rem，则元素的大小为32px。4.vwvw是浏览器视觉窗口的宽度，分为100份，每份1vw，100vw则为浏览器窗口宽度的
2022-04-27 19:43:44
137
原创 react报错Functions are not valid as a React child. This may happen if you return a Component instead o
react报错 Functions are not valid as a React child. This may happen if you return a Component instead of <Component>react渲染路由组件时，循环遍历使用route展示对应的组件，element里面写对应的组件时，如果直接用element={route.component}会报错，这时不会将route.component渲染成组件，而应该写成element={<route.c
2022-04-19 10:23:35
4594
1
原创 Vue中插槽的使用
Vue中的插槽分为匿名插槽、具名插槽、作用域插槽，总结其用法1、默认插槽默认插槽不需要为插槽指定名称，默认会有一个default名称，这种插槽适用于只插入一个内容的时候。在HTML标签中slot:default可以省略写法：slot在HTML标签上时直接写：slot:default当在template标签上时写成v-slot:default 或者#default（此时不可省略）在同一个地方不能出现相同的插槽名，否则编译报错也可以为<slot></slot>..
2022-04-18 15:56:19
669
原创 css3渐变
css3提供了两种渐变方式：线性渐变（向下/向上/向右/向左/对角/任意角度方向） 径向渐变（由中心定义）用background-image属性来控制渐变1.线性渐变为了创建一个线性渐变，你必须至少定义两种颜色结点。颜色结点即你想要呈现平稳过渡的颜色。同时，你也可以设置一个起点和一个方向（或一个角度）。若不指定渐变方向，则默认从上到下语法：background-image: linear-gradient(direction, color1, color2, ...);从上到下
2022-04-12 16:24:37
173
原创 css组合选择器
css3中包含了四种组合选择器：后代选择器(以空格分隔) 子元素选择器(以大于号分隔 >） 相邻兄弟选择器（以加号分隔 +） 后续兄弟选择器（以破折号分隔 ~）1.后代选择器后代选择器用于选取某元素的后代元素。以下实例选取所有 <p> 元素插入到 <div> 元素中：div p { background-color:yellow;}<div> <h2>DIV 内部标题</h2> <p>
2022-04-11 21:23:33
1606
原创 Vuex在Vue3中的使用
在Vue3中使用Vuex的时候，发现与Vue2中的使用方式有所不同，故总结一下1.使用createStore创建sotre文件import { createStore } from 'vuex'export default createStore({ state: { }, mutations: { }, actions: { }, modules: { }, getters:{ }})2.在main.ts
2022-04-03 15:45:01
1151
原创 js字符串substr和substring的区别
js中的substr和substring都能够截取字符串，但两者之间的截取有不一样的地方相同点参数都是可以有一个或者两个语法：substr(start, [length]) start参数必传，length参数不必传substring(start, [end]) start 参数必传， end参数不必传当两个函数的参数都只有一个时，两者的功能是相同的不同点substr第二个参数传的是截取的字符串的长度当length为0或者为负数时返回空字符串substring第二个参数.
2022-04-03 14:56:38
735
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人