- 博客(81)
- 资源 (5)
- 收藏
- 关注
原创 报红:找不到名称ref ts(2304)、‘ref‘ is not defined. eslint(no-undef)
设置完自动导入之后,组件中报错报红:找不到名称ref ts(2304)、'ref' is not defined. eslint(no-undef)
2024-07-24 16:27:19
275
原创 自动导入unplugin-auto-import+unplugin-vue-components
Vite项目配置自动导入工具unplugin-auto-import和unplugin-vue-components
2024-07-24 15:26:31
770
原创 微信小程序中路由跳转的方式有哪些?区别?
微信小程序路由跳转方式:navigateTo、redirectTo、navigateBack、switchTab、reLanch。
2024-04-26 11:27:23
1295
原创 vue权限按钮的实现
在做信息后台管理或涉及到不同权限的用户可以操作不同的功能时,常常会用到权限按钮,本文介绍了三种权限按钮的实现方法,v-if搭配函数、组件+插槽、自定义指令。
2023-07-24 20:44:42
3837
原创 怎么把网页变成灰色?怎么让头像或某一部分不变灰色?filter/backdrop-filter/mix-blend-mode/svg/grayscale(1)
在国家公祭日,我们哀悼沉思,势要勿忘国耻振兴中华;这些时段很多网站都会积极呼应,给与自己的网页设置成灰色;那给网页设置成灰色是经过怎样的设置来实现的呢?filter?backdrop-filter?mix-blend-mode? svg?grayscale(1)?
2023-02-04 14:36:36
1803
1
原创 vue项目中使用svg(自动导入+组件复用)
vue中通过svg-sprite-loader进行svg图标的资源解析,创建SvgIcon组件以做组件复用,避免每次都要import做图标的导入操作,实现资源的自动化导入
2022-10-29 20:37:56
1884
原创 导出与导入(require,import,module.exports,exports,export,export default)
import和require进行模块的导入,export、export default;exports、module.exports;不同的导出方式对应的导入结果
2022-10-24 18:09:13
2601
原创 页面滚动那些事儿(滚动条样式自定义,隐藏滚动条,scrollIntoView遇到头部fixed定位滚动被遮挡、vue-scrollto插件的应用)
隐藏滚动条、设置滚动条样式、通过ScrollIntoView、vue-scrollto来实现将对应的版块滚动至顶部的效果
2022-09-09 23:42:37
3785
原创 Vue2双向绑定,Object.defineProperty、Observe、Compile、Watcher、Dep各显神通,相辅相成
Vue2.x双向绑定原理:除Object.defineProperty()数据劫持,还有Compile模板解析、Watcher订阅者、Dep收集订阅者以便对订阅者们做同一更新处理,相辅相成以实现数据劫持、模板引用数据提取、模板引用数据对应值的更新等多方面功能...
2022-07-13 00:00:07
925
2
原创 前端登录时所做的token验证(路由守卫、请求拦截器、响应拦截器)
登录后的token校验,使用全局路由守卫beforeEach()先判断目标页面是否需要token身份校验,使用请求拦截器将token配置到请求对象上,借助响应拦截器提前处理token失效问题
2022-06-29 15:23:16
7730
2
原创 浏览器组成、回流、重绘及性能优化
1、浏览器组成用户界面: 包括地址栏、后退/前进按钮、书签目录等,也就是除了用来显示所请求页面的主窗口之外的其他部分。浏览器引擎: 用来查询及操作渲染引擎的接口 。渲染引擎(浏览器内核):用来显示请求的内容,例如,如果请求内容为html,它负责解析html及css,并将解析后的结果显示出来 。网络:用来完成网络调用,例如http请求,它具有平台无关的接口,可以在不同平台上工作 。UI 后端:用来绘制类似组合选择框及对话框等基本组件,具有不特定于某个平台的通用接口,底层使用操作系...
2022-05-31 14:24:42
274
原创 【解决】微信小程序wx.getBackgroundAudioManager()写音频播放时,暂停后再播放又从头开始了
最近写小程序时涉及到音频播放,自然是少不了getBackgroundAudioManager(),也为用户提供方便,可以通过系统的暂停/播放来同步控制小程序的音频的暂停/播放。那么在使用的时候,我暂停了,调用了pause(),播放时我错在了直接给设置了歌曲的链接。核心点在:判断当前的歌曲链接是不是被暂停的歌曲的链接,不是原来的歌就重新赋予链接地址,否则也就是原来的歌,那就不赋予链接地址而是调用play()方法。...
2022-05-29 00:45:01
2302
原创 for,for...in,for...of,forEach对于数组、对象、Set和Map
这些虽然是基础知识,但在做的时候使用vue语法涉及到条件渲染,然而用错了for in和for of致使渲染数据出错,又来夯实了下这个基础知识。我出的问题在于列表渲染时应该用键值(value),而我却拿的是键名(key),绝了。1、for of---遍历键值for of 语句遍历可迭代对象(包括数组、Set 和 Map 结构、arguments 对象、DOM NodeList 对象、字符串等)。拿数组来说:let arr = ['xi','bing','g'];for (let v o
2022-05-28 23:27:24
293
原创 getLocation小程序获取用户地理位置,逆地址解析(位置描述),将经纬度转为省市区的位置描述
在近期做得一个小程序里要展示当地天气情况,这也就意味着要获取当前位置信息,小程序这边需要getLocation来向用户发起弹窗申请授权获取位置信息。就像下面这样:不过呢,现在的getLocation()只能获取到用户当前位置的经度、纬度.......又让我回想起高一时那个地理我刚及格的成绩,咱得把经纬度再转成位置才行(因为我的后端是根据 省市区 来进行天气获取的,而不是经纬度,就像"北京市-北京市-海淀区"),也就是:逆地址解析查资料后发现要用【腾讯位置服务】,这个东西可以给我们提供上面的功能—
2022-05-22 12:26:44
5744
原创 uniapp-微信小程序-图片转base64
当前在做得小程序设计拍照识别,而服务器方需要前端提供图片的base64编码作为参数进行解析识别,一开始想着走原生JS的base64方法——借助canvas,当然我也试了,就在自己觉得没问题的时候,调试时终端报错了:ReferenceError: Image is not defined.我着实懵了,也就是说Image对象实例化在小程序这边是无效的,查资料后真的很打脸,虽然人家微信不给Image用,但是人家给提供了转base64的方法。咱直接用就行了,唉,要是早一点对目标问题进行查询,早点看文档也许不用走
2022-05-22 00:16:41
3995
原创 Js原生轮播图切出切面一段时间再回来,轮播动画混乱问题
这个问题是早前自己玩轮播图时遇到的,查了些资料,但大多都对不上我的问题,最后在知知乎乎那里看到了解释。解释是这样说的:页面切走,有的浏览器会正常走定时器,正常更新排版视图。有的则放慢定时器,停止排版视图更新,甚至有插电和不插电的笔记本是否进入节能模式,浏览器为了节能,其优化策略都会产生调整,比如定时器精度变化.。如果代码没考虑到这些问题,可能会出岔子,个人建议,你的动画体系要以帧为主要核心。而不是以时间,见过市面上大多数动画库都错误的把时间作为缓动核心...可以按照第一句解释来看,就出在浏览器对
2022-05-17 22:06:47
621
原创 【将Ajax的异步转为同步,获取Ajax的success内部的返回值】---Promise来助力
封装了个简单的ajax(get或post)---ajaxJar函数想着拿用户登录来测试下,结果一测试就没刹住车......在用户的注册功能中,对用户名的input绑定了onblur事件,当失去焦点时判断是否为空,如果不为空再到数据库中查询这个用户名是否已经被占用了;当最后点击提交按钮的时候再调用检查用户名是否被占用的方法,如果是则不予通过,否则通过并完成注册。/*B函数*/function findUsername(obj){ /*...是否为空的逻辑*/ /*不为空发起查询
2022-05-01 00:01:43
731
原创 Vue插槽的使用(匿名插槽、具名插槽、作用域插槽)以及ElementUI中table-column的slot-scope应用(scope.row、scope.$index、scope.column)
先说说插槽的使用:(才疏学浅,白话表述)可以把插槽理解为组件B中留下的一个坑,谁用这个坑谁就可以往里面填放东西,同时呢,谁也就要认组件B做儿子-----组件B也就成了这个来填坑的组件的子组件。插槽不单单是可以让父组件用它填充东西,也可以引用子组件的数据,而父组件用坑的时候也就可以用子组件传过来的数据。单个插槽(默认插槽、匿名插槽)子组件:(slotdemoson.vue)<template> <div> <h2>子组件<..
2022-02-17 23:53:11
8368
5
原创 Vue对ElementUI的组件按需引入时:报错Cannot find module:babel-preset-es2015
解决ElementUI在Vue项目中按需引入时关于babel-preset-es2015的报错:Error:Cannot find module:babel-preset-es2015Error:Plugin/Preset files are not allowed to export objects, only functions. In...
2022-01-13 17:02:17
3469
5
原创 Vue-初识(安装devtools浏览器调试工具、容器与vue实例、模板语法、事件绑定、条件渲染 、列表渲染)
下载安装配置Vue调试工具的教程放到这里喇:安装Vue-devtools浏览器调试工具容器与实例的关系:容器:简单的说就是Vue实例中el的属性值在页面结构中对应的标签实例:使用vue就要创建一个Vue实例用于管理页面、数据的渲染等功能容器与实例是一对一的关系,当一个容器 已经被一个Vue实例接管后,其他的实例再绑定这个容器对这个容器进行操作是没有作用的。(当然通常开发中就一个Vue实例,剩下的配合组件去使用)Vue指定容器的两种方式:方式1:通过实例el属性指定(el的属性值值通常
2021-11-08 13:24:41
696
原创 Git的.gitignore;Github的readme
Git工具可以管理本地仓库中的文件,但是有一些文件并不是想要git来管理。例如:我们项目中的node_modules中的文件,都是一些功能模块,而这些模块又不会有什么更改,有package.json文件存在,其他开发者根据package.json中记录的模块版本进行下载即可,也就不用将node_modules这个大东西推送至远程仓库了。那如何摆脱git的管理呢?在本地仓库根目录建立名为 .gitignore 的文件,将不用git管理的文件写在其中即可摆...
2021-10-11 10:52:41
227
原创 GitHub:SSH协议之免登陆推送
在使用Git将本地仓库推送到远程仓库Github中时,用HTTP协议地址进行推送时,需要验证账户信息(要求输入账号和密码,密码验证废弃后由token口令取代,虽然我们可以将token口令封存起来,但还是需要输入用户名)。 而Github提供的SSH协议就可以避免这个操作,我们可以在本地仓库上创建密钥,密钥分公钥和私钥,其中公钥存在于Github上,私钥存在于自己的电脑上。当推送本地仓库到远程仓库推送时,远程的公钥和本地的私钥就会进行配对,配对成功后才允许操作。对于不同的项目...
2021-10-11 10:28:24
333
原创 GitHub:push、clone、pull及多人协作
使用命令:git push 远程仓库地址 要推送的分支 来将本地仓库推送至远程仓库 例如推送主分支到远程仓库:git pushhttps://github.com/xibing-Geng/github-demo.git master但是远程仓库地址较长,每次输入命令需要每次复制粘贴很麻烦我们给这个远程仓库地址设置别名,以后用到这个远程仓库地址的时候,直接输入别名代替即可使用命令:git remote add 别名远程仓库地址 来给远程仓库地址添加别名...
2021-10-10 00:15:56
2080
1
原创 GitHub:git push问题remote:Support for password authentication was removed on August 13,2021.
使用git push origin master向远程仓库推送时被告知:remote:Support for password authentication was removed on August 13,2021.Please use a personal access token instead.push的时候需要输入github的账户名和密码,而这里的大概意思就是密码验证在2021年8月13号被移除了,需要使用个人账户的token来取代密码验证。token其实就是一串字符,这串字符.
2021-10-09 22:05:22
3307
3
原创 Git使用(工作流程、使用配置、命令操作、分支branch、临时缓存stash)
Git是一个可以供我们使用的软件,首先要对Git进行下载安装;在工作中,经常会出现一些情况(例如:某个功能开发错误,需要退回某个时候的编辑版本来重新开始开发,那这个时候可能会想到将之前的文件在开发前进行备份,而当文件过大时,单纯的对文件进行备份,就要占用一定的空间内存;鉴于此,使用Git,它可以保存文件的编辑记录[第n行增加了‘hello word’,第m行删除了‘hi’],当我们需要返回原来的编辑状态时,可以执行相关的命令,Git会根据它保存的文件修改记录来进行‘编辑退回’,也就返回了原来...
2021-10-03 19:58:52
249
原创 Ajax:获取服务端XML数据(responseXML、content-type)
XML:用于存储和传输数据,关注的是数据的内容HTML:用于展示数据,关注的是数据的外观平时使用response来获取服务端的响应数据;对于XML数据需要使用responseXML来获取。客户端获取到的responseXML有着和document类似的获取标签元素对象的方法从而可以从存在标签的响应数据中获取到被包裹在内的值<body> <!-- XML:用于存储和传输数据,关注数据的内容 HTML:用于展示数据,关注数据的外观 --> <.
2021-10-01 18:44:45
1221
原创 Ajax基础:restful风格api
获取信息:get;删除信息:delete;修改信息:put;1、模拟获取用户信息(get+路由)<body> <script src="js/jquery-3.5.1.min.js"></script> <script> // 获取用户信息 setTimeout(() => { $.ajax({ type: 'get', .
2021-10-01 18:04:45
201
原创 jQuery中$get方法、$post方法的使用
get方法三个参数:请求地址,请求参数,和回调函数(用于处理服务端的响应数据)<body> <button id="btn">发送jsonp请求</button> <script src="js/jquery-3.5.1.min.js"></script> <script> $('#btn').on('click', function() { $.get('/bas.
2021-10-01 17:31:13
496
原创 Ajax基础:发送jsonp请求(jsonp、jsonCallback)
jsonp走的是get请求方式,也就是ajax的默认请求方式;ajax方法中也涵盖了jsonp请求,可以通过ajax方法来发送jsonp请求;<!--客户端代码--><body> <button id="btn">发送jsonp请求</button> <script src="js/jquery-3.5.1.min.js"></script> <script> $('#bt
2021-10-01 16:30:20
10818
1
原创 表单数据序列化之serialize()、serializeArray()方法的使用
serialize()可以对表单中的数据进行拼接可能之前有过这种情况:客户端将表单信息通过获取到表单项的值,再把这些值进行拼接,再将拼接好的字符串发送到服务端;现在可以使用serialize()来对表单信息进行自动拼接,serialize方法的出现使得可以不用获取每个表单项就可以拿到拼接好的字符串。注意:serialize()方法是对于表单而言的,该方法的调用者应该是某个表单对象测试serialize():<body> <form id="form">
2021-10-01 14:10:56
4518
原创 Ajax基础:jQuery中封装的ajax方法的使用(重点:传递json类型数据-避免ajax方法对请求参数的默认格式转换)
ajax是一种经常用到的技术,而除了自行封装外,jQuery也对ajax进行了封装,所以被jQuery封装的ajax方法首先明确的是源于jQuery,自然要将jQuery的js文件引入<script src="js/jquery-3.5.1.min.js"></script>这里通过点击按钮后触发客户端ajax请求的发送<button id="btn">发送请求</button><script>// 为id为btn的按钮绑定
2021-10-01 11:59:06
822
原创 Ajax基础:携带cookie信息实现跨域登录功能(cookie的传递、express-session模块的使用)
注意事项: 1、携带cookie需要客户端的Ajax对象属性withCredentials值为true 2、携带cookie需要服务端配置头信息Access-Control-Allow-Credentials为true 3、携带cookie需要服务端的配置头信息Access-Control-Allow-Origin为具体域名,不是 *服务端3000客户端html代码:<body> <div id="container"...
2021-09-24 20:01:39
742
原创 Ajax基础:访问非同源数据(服务器解决方案、request第三方模块)
同源可以限制客户端的Ajax请求,但是不能限制服务器端所以,可以让客户端先向自己所属的服务器发送请求,自己的服务器再向另一个服务器发送请求端口3000的html代码:<body> <button id="btn">提交请求</button> <script src="js/ajax.js"></script> <script> var btn = document.getElemen
2021-09-24 11:24:16
198
原创 Ajax基础:CORS跨域
CORS,跨域资源共享,允许浏览器向服务器发送Ajax请求,克服Ajax只能同源使用的限制操作: 服务端配置响应头,客户端继续使用ajax,客户端不需要做出调整 1、允许哪些客户端访问我(*表示所有):res.header('Access-Control-Allow-Origin', '*') 2、允许客户端使用哪些请求方法访问我:res.header('Access-Control-A...
2021-09-24 10:25:39
431
原创 jsonp函数封装
封装jsonp函数需要考虑的因素:(涉及到传参->函数+请求参数,需要为封装的jsonp添加形参)function jsonp(options) {}1、script标签的创建 var script = document.createElement('script');2、请求地址中需要传递的参数、对参数进行拼接var params = '';// options中的data值为需要传递的请求参数,是要以key=value&key1=value1进行传递的,所以
2021-09-23 23:18:10
774
前端使用CSS把网页设置成灰色的几种方案
2023-02-07
Notepad++7.5.7-64位安装包.zip
2019-08-03
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人