- 博客(56)
- 资源 (3)
- 问答 (3)
- 收藏
- 关注
RSS订阅原创 vite vue-cli 之vue3安装Vue devtools调试工具
官方默认推荐的就是内置vite-plugin-vue-devtools安装使用和Vue.js devtools 使用安装
2024-05-20 14:28:57
360
原创 VScode 集成终端设置默认打开当前文件夹 mac系统
搜索 openInIntegratedTerminal 如图：点击设置 搜索 ntegrated:cwd 如下图：
2024-04-01 16:21:17
468
原创 JS 节流防抖
防抖是将多次执行变为最后一次执行，一个高频事件触发后 n 秒内函数只会执行一次，如果在 n 秒内高频事件再次被触发，则重新计算时间。这就像如果你正在等公交车，只要在等待时间内有人上车，公交车就会等到这个时间结束后才开走。关键点：setTimeout 定时器 apply arguments 闭包。
2024-03-29 09:30:00
385
原创 Web Speech API的语音识别技术
这是一个实验性技术目前兼容性如图：pc端几乎兼容，移动端部分不兼容网页语音 API 的接口是语音服务的控制接口；它可以用于获取设备上关于可用的合成声音的信息，开始、暂停语音，或除此之外的其他命令。SpeechSynthesis 也从它的父接口继承属性，EventTarget.SpeechSynthesis.paused 只读当SpeechSynthesis 处于暂停状态时， Boolean值返回 true。SpeechSynthesis.pending只读。
2024-03-13 17:26:46
1220
原创 excel-gen.js 导出excel 功能
主要是highcharts图表数据导出为excel，highcharts本身自带导出功能和额外使用excel-gen.js编写导出功能。
2023-11-20 18:04:06
710
原创 模板语言-Handlebars
Handlebars 是什么Handlebars 是一种简单的模板语言。它使用模板与传入的对象来生成HTML 或者其他文本格式。Handlebars 模板看起来像是嵌入了handlebars 表达式的普通文本。
2023-09-11 11:09:14
600
原创 浏览器端代理proxy 解决跨域
使用express+http-proxy-middleware直接上代码 最后通过http://localhost:3001 访问。
2023-07-27 14:55:23
395
原创 子元素比父元素 z-index高低的问题
大坑---设置父relative z-index:0 子元素居然比父元素的兄弟元素低一个层级！原因：当你将父元素的position属性设置为relative并且z-index属性设置为0时，子元素无论尺寸大小如何都会处于父元素的后面。这是因为在这种情况下，父元素和子元素处于同一个堆叠上下文中，并且父元素的z-index值是0。
2023-07-03 18:10:27
1012
原创 学习svg 基本使用
在左上角是path路径代码 ，左下角自动生成对应的数据 方便可视化画各种简单的图像一键生成svg。并且右上角可以导出svg图片。
2023-06-19 11:04:15
192
原创 css3 grid 布局
网格布局（Grid）是最强大的 CSS 布局方案。它将网页划分成一个个网格，可以任意组合不同的网格，做出各种各样的布局。以前，只能通过复杂的 CSS 框架达到的效果，现在浏览器内置了。上图这样的布局，就是 Grid 布局的拿手好戏。Grid 布局与Flex 布局有一定的相似性，都可以指定容器内部多个项目的位置。但是，它们也存在重大区别。Flex 布局是轴线布局，只能指定"项目"针对轴线的位置，可以看作是一维布局。
2023-06-19 10:36:17
1558
原创 v-html 渲染模板后有些样式没上去或者嵌套子组件样式没上去
引用官方的话说就是：“当标签带有scopedattribute 的时候，它的 CSS 只会影响当前组件的元素”还有一个小tip通过v-html创建的 DOM 内容不会被作用域样式影响，但你仍然可以使用深度选择器来设置其样式。
2023-04-20 10:34:31
708
1
原创 使用mock&json-server 搭建 mock-server
使用mock配合json-server搭建，需了解nodejs，express，中间件，json-server等知识。
2023-03-29 16:09:46
473
原创 css3 position定位—— sticky 定位
当页面滚动超出目标区域时，它的表现就像 position:fixed;，它会固定在目标位置。
2023-03-24 09:49:02
1325
原创 vue3.0 proxy设置代理不成功
最后还是出现在axios的默认基本路径的配置和代理发生了冲突，代理本身是将请求基本路径代理到目标基本路径。要么设置为项目启动路径http:localhost:8080要么设置为空。axios 基本路径却设置为http:localhost:3000,项目基本路径是http:localhost:8080。代理目标路径为：http:localhost:3000。首先在项目中创建vue.config.js。注意在ts环境下仍为js结尾。此时项目启动仍然报错跨域。axios的基本路径。
2023-03-20 15:33:59
7591
原创 vscode autoprefixer插件 将less/scss/css文件自动添加浏览器兼容前缀
在less/scss/css页面，使用ctrl+shift+p快捷键，选择autoprefixer即可自动全部添加。真的方便多了 ，还有它官网，支持线上直接转换。也可自行绑定相关快捷方式。
2023-01-29 17:19:47
1794
原创 vue常见高频面试题整理
JavaScript中的对象是引用类型的数据，当多个实例引用同一个对象时，只要一个实例对这个对象进行操作，其他实例中的数据也会发生变化。而在Vue中，更多的是想要复用组件，那就需要每个组件都有自己的数据，这样组件之间才不会相互干扰。所以组件的数据不能写成对象的形式，而是要写成函数的形式。数据以函数返回值的形式定义，这样当每次复用组件的时候，就会返回一个新的data，也就是说每个组件都有自己的私有数据空间，它们各自维护自己的数据，不会干扰其他组件的正常运行。
2022-10-17 08:30:00
2148
原创 Swiper3.x 自定义指示器-pagination
很久没有更新博客了，最近一直在写静态页面，这就总是避不开swiper轮播，那swiper3.x以上版本怎么自定义一个指示器呢pagination？
2022-09-19 19:03:55
1746
原创 react-redux 的基础用法
React 是 DOM 的一个抽象层（UI 库），并不是 Web 应用的完整解决方案。因此react在涉及到**数据的处理**以及**组件之间的通信**时会比较复杂。对于大型的复杂应用来说，这两方面恰恰是最关键的。因此，只用 React三.class声明组件对store的使用主要用到了connect高阶柯里化函数对仓库的映射和组件的传值的封装三.函数声明的组件对store的使用主要是使用hooks中的useSeletor 和useDispatch来完成redux的数据传递和派送事件.
2022-07-12 18:55:59
294
2
原创 React框架
React是一个用于构建用户界面的javaScript库，起源于facebook的内部项目，后续在13年开源了出来你只需要描述UI看起来是什么样式，就跟写HTML一样，React负责渲染UI组件时React最重要的内容，组件表示页面中的部分内容使用React可以开发Web应用，使用React可以开发移动端，可以开发VR应用npm i react react-dom 创建React元素 渲染到页面 创建元素 渲染到页面...
2022-07-05 10:04:32
520
1
原创 [system] Map key not configured.
今天写uniapp 用内置组件map时报[system] Map key not configured解决方案在uniapp 的项目的 manifest.json的h5配置里面配置一下key自己去申请，申请腾讯地图的key可点击此处 最终效果
2022-06-29 16:57:54
4750
原创 【同源跨域】---解决ajax跨域问题的三种解决方案
“同源”：协议相同、域名相同、端口相同。“同源的目的” ：只有在一个服务器上的文件才能互相交互，多个服务器之间的文件禁止1995年，同源政策由Netscape公司引入浏览器，最初的目的是某页面所设置的cookie，只能由其“同源”页面打开。如果两个页面拥有相同的协议、域名和端口，那么这两个页面就属于同一个源，其中只要有一个不相同，就是不同源。举例来说，这个网址，协议是，域名是，端口是（默认端口可以省略）。它的同源情况如下。目的：同源政策的目的，是为了保证用户信息的安全，防止恶意的网站窃取数据。限制：随着互联
2022-06-22 10:45:08
1888
原创 vue之组合API-computed函数的学习
定义计算属性：computed函数，是用来定义计算属性的，计算属性不能修改。高级用法：加入set和get函数 目的：让计算属性支持双向数据绑定。给computed传入函数，返回值就是计算属性的值给computed传入对象，get获取计算属性的值，set监听计算属性改变。...
2022-06-14 15:06:20
160
原创 Vue3.0 是什么？
vue3.0最火框架，它是国内最火的前端框架之一性能提升，运行速度事vue2.x的1.5倍左右体积更小，按需编译体积比vue2.x要更小类型推断，更好的支持Ts（typescript）这个也是趋势组合API (composition api) ，能够更好的组织逻辑，封装逻辑，复用逻辑...
2022-05-31 09:32:07
1572
3
原创 vue3 报错-基于Vite编译Vue3项目Uncaught SyntaxError does not provide an export named ‘default‘
Uncaught SyntaxError: The requested module '/@modules/axios/index.js' does not provide an export named 'default'
2022-05-26 10:36:56
23267
10
原创 typescript 是干什么的？
一.TypeScript 是什么TypeScript (简称： TS )是 JavaScript 的超集 ( JS 有的 TS 都有)。 TypeScript = Type + JavaScript (在 JS 基础之上，为 JS 添加了类型支持)。TypeScript 是微软开发的开源编程语言，可以在任何运行 JavaScript 的地方运行。二.TypeScript 为什么要为 JS 添加类型支持？背景： JS 的类型系统存在“先天缺陷”， JS 代码中绝大部分错误都是类型错误( Unc
2022-05-20 17:38:25
987
2
原创 vue 基础之父子组件传值
一父组件传子组件下面这个demo 用的是js引入的方法，父组件绑定动态属性，子组件用props接收对应的值注意，实际传值过程中，如果要改变props中的值，不能直接处理，一般用computed重新创建一个属性，做相对应的处理， <div id="app"> 父组件 <son v-bind:str="msg"></son> </div> <template id="son">
2022-05-17 12:43:56
213
2
原创 JSON-server 的增删改查
一.json-server工具作用： json-server可以快速的模拟接口 它是一个基于nodejs的命令行工具，例如：nodemon 安装： npm i json-server -g 全局安装 二.增删改查1.接口规则-RESTful目标：了解一种接口定义规范resetful接口规范：如何定义接口地址，请求方式，传参方式，对应不同的请求操作行为。具体规则：接口地址 请求方式 操作行为 /brands GET 查询所有
2022-05-07 09:41:33
6644
7
原创 sequelize处理表模型的增删改查
这里注意，主要用到了sequlize 框架和mysql2 驱动sql语句。其中的返回值是复杂对象，所以需要转一道所有的sequelize支持的表模型的增删改查方法，返回值均为promise ，这里的处理均为await关键字和async修饰符。以下是案例：const student = require("../model/student");//分页查询exports.getStudent =async (page=1,num=10)=>{ let result =
2022-04-27 10:06:14
800
3
原创 【JS实战】隐藏input -file，点击图片触发文件上传，并存到数据库中
在写个人博客过程中，遇到一个问题，点击图片更换图片，并将图片文件上传到数据库这个也可以应用到上传头像，改变头像下面来看一下实现过程：html部分 <img src="${data.imgUrl}" id ="imgs"/> <input hidden type="file" id="files1" multiple onchange ="imgChange()" size="mini"> css部分就是将两
2022-04-19 21:05:45
2191
1
原创 【cookie中储存token令牌】express的应用场景
首先思考一个问题，为什么会出现cookie？假设一个新闻网站，服务器有一个接口，通过请求这个接口，可以添加发布一篇文章。但是，不是任何人都有权力做这种操作的服务器如何知道请求接口的人是有权力的呢？只有登录过的管理员才能做这种操作问题是，客户端和服务器的传输使用的是http协议，http协议是无状态的，什么叫无状态，就是服务器不知道这一次请求的人，跟之前登录请求成功的人是不是同一个人。由于http协议的无状态，服务器忘记了之前的所有请求，它无法确定这一次请求的客户端，就是之前登录成功的那个客户端。
2022-04-18 11:50:40
1833
4
原创 【express在node中的基础使用】搭建服务器，完成静态伺服
一.服务端基本三层解构1.1 路由层也叫表现层：搭建服务器，编写静态私服接口都应该写在路由层Router目录文件夹下1.2 服务层：编写DAO中的各表的增删改查功能1.3DAO层：主要完成建库建表建字段的功能如果想知道如何利用sequelize联动mysql完成建库建表建字段 请看我上一篇博客https://blog.csdn.net/weixin_48813932/article/details/124041795?spm...
2022-04-13 17:14:34
1734
4
原创 【Sequelize在node中的基础使用】建库建表建字段
一.ORMObject Relational Mapping 对象关系映射1.作用：通过ORM框架，可以自动的把程序中的对象和数据库关联ORM框架会隐藏具体的数据库底层细节，让开发者使用同样的数据操作接口，完成对不同数据库的操作2.原理如图所示3.ORM的优势1.开发者不用关心数据库，仅需关心对象2.可轻易的完成数据库的移植3.无须拼接复杂的sql语句即可完成精确查询二.node中的ORM-sequelize框架1.下载：在vscode中下载npm i sequeliz
2022-04-08 15:18:05
1898
3
原创 promise 源码实现
废话不多说直接上代码，这里用到了 单例模式和 立即执行函数思想const MyPromise = (() => { // 定义三种状态 const PENDING = "pending"; const RESOLVED = "resolved"; const REJECTED = "rejected"; //定义不让外界访问的符号属性，状态和数据 const PromiseResult = Symbol("PromiseResult")
2022-04-02 14:14:09
80
excel-gen.js 导出excel 功能
2023-11-20
javaScript基础入门篇-运算符+类型转换+流程控制语句
2021-12-17
flex布局中换行时，行与行之间为什么存在间隙
2021-08-23
push用法失效，为什么没有添加到数组中
2021-05-27
TA创建的收藏夹 TA关注的收藏夹
TA关注的人