- 博客(152)
- 收藏
- 关注
原创 使用javascript 点击tab栏切换事件代码记录
1. javascript 点击tab栏动态切换内容,并添加active。2. javascript 点击左右图标可以向左或者向右移动元素。第2点功能,改变ul的style,tanlateX 移动。
2023-11-27 16:23:39 738
原创 Ant Design Pro 前端脚手架 配置混合导航
点击查看阅读混合导航:顶部导航和侧边栏导航实现联动效果,点击不同的顶部导航按钮会显示对应的子菜单项。实现点:1. 路由的配置。
2023-08-17 09:38:53 1216
原创 项目集成Eslint
该命令将引导你完成一些配置选项,例如你是否希望使用风格规范,使用哪种风格规范(如 Airbnb、Standard 等),以及支持哪种 JavaScript 版本等。选择适合你项目的配置选项即可。通过以上步骤,你就可以将 ESLint 成功集成到你的项目中,从而在代码开发过程中实现更好的代码质量控制。加入 ESLint 校验是一个很好的做法,它可以帮助你在项目中发现潜在的代码错误和风格问题,从而提高代码质量和可维护性。在这个文件中,你可以对 ESLint 进行更多的配置,例如添加/修改规则,配置插件等。
2023-07-03 17:13:52 552
原创 【ProComponents】如何修改ProForm的默认按钮
ProForm 是一个 React 表单库,它提供了一些默认的表单按钮,比如“提交”和“重置”按钮。如果你想修改这些默认按钮,你可以使用 ProForm 的。函数来定义自定义的提交和重置按钮。这两个函数的第一个参数是一个包含一些属性的对象,包括表单对象。注意,在使用自定义按钮时,你需要自行处理表单的提交和重置逻辑。在上面的示例代码中,我们使用了。属性,这两个属性允许你自定义表单按钮的文本、样式和事件处理程序。这些属性可以被用来定制按钮的文本和事件处理程序。组件,以便将它们用于渲染表单的提交和重置按钮。
2023-04-18 17:56:45 2536 1
原创 A跳转B 使用PostMessage API 实现携带参数
需要注意的是,PostMessage API 也需要进行跨域配置,即在 A 和 B 域名中分别设置对方域名的白名单。同时,PostMessage API 可能存在安全风险,需要注意数据传输的安全性。当 A 域名跳转到 B 域名时,可以使用 PostMessage API 实现在 A 域名中携带参数并在 B 域名中使用的功能。在 B 域名中使用 PostMessage API 接收消息,并解析出参数。可以确保消息被发送到父级窗口(即 A 域名所在的窗口),确保消息来自 A 域名,可以是任意类型的数据,
2023-04-18 15:18:51 467
原创 【vite+vue3】一个项目包含多个小项目并实现多项目单独打包部署访问
1. projectA项目和projectB项目中均要保留index.html、main.ts/js 、App.vue 这三个文件可以直接复制粘贴src下的index.html、main.ts/js 、App.vue文件内容,需要注意的是main.ts路径引入的变化,以及路由的路径引入正确与否。公司有两个项目,UI界面以及框架是一致的,且有很多个公用的组件可以共同使用。所以想着在一个大的项目里实现两个小项目:projectA和projectB项目,公共部分提取出来。3. 配置package.json。
2023-04-06 23:52:12 6599 6
原创 【vite+vue3】 多页面应用模式
访问地址变为localhost/src/project/portalProject/index.html。的值将仍然是 vite.config.js 文件所在的目录。因此,你需要把对应入口文件的。在开发过程中,简单地导航或链接到 src/project/projectA。注意⚠️在运维部署时,访问该html,需要多写点路径才能正常访问。- 将会按预期工作,与正常的静态文件服务器表现一致。如果你指定了另一个根目录,请记住,在解析输入路径时,假设你有下面这样的项目文件结构。npm run dev 即可。
2023-04-06 22:38:04 1633
原创 es6 按照不同条件导入不同模块
函数来导入模块,并返回一个 Promise 对象。在使用时,我们可以根据不同的条件调用。我们可以使用条件语句和动态导入的方式来实现这一功能。注意,我们使用了动态导入的方式,即使用。在上面的代码中,我们定义了一个。)动态导入不同的模块。函数,并在 Promise 的。函数,根据不同的条件(方法中使用相应的模块。
2023-04-03 22:41:14 370
翻译 浏览器控制台报错:Cross origin requests are only supported for protocol schemes
安装好后,切换到index.html 所在的文件夹,运行 anywhere。使用anywhere(静态文件服务器),可以使用npm 安装。vue项目打包后,想要访问index.html。安装好后,右键要打开的文件,就会出现“主要就是本地file文件反问提示跨域。Live Server插件。
2023-03-31 16:22:02 613
原创 【css】深入解析CSS (5)定位和层叠上下文
跟固定或者绝对定位不一样,不能用top、right、bottom和left改变相对定位元素的大小。这些值只能让元素在上、下、左、右方向移动。可以用top或者bottom,但它们不能一起用(bottom会被忽略)。跟固定元素一样,属性top、right、bottom和left决定了元素的边缘在包含块里的位置。定位一个元素时,不要求指定四个方向的值,可以只指定需要的方向值,然后用width和/或height来决定它的大小,也可以让元素本身来决定大小。这些属性的值决定了固定定位的元素与浏览器视口边缘的距离。
2022-12-27 16:36:52 204
原创 深入解析CSS (3)Flexbox
Flexbox,全称弹性盒子布局给元素添加display: flex,该元素变成了一个(flex container),它的直接子元素变成了弹性子元素默认是在同一行按照从左到右的顺序并排排列。弹性容器像块元素一样填满可用宽度,但是弹性子元素不一定填满其弹性容器的宽度。弹性子元素高度相等,该高度由它们的内容决定。flex属性控制弹性子元素在主轴方向上的大小(在这里指的元素的宽度)flex属性是三个不同大小属性的简写:flex-grow、flex-shrink和flex-basis。
2022-12-19 17:35:50 451
转载 【 umi ant-design-pro 】项目 启动项目提示sh: umi: command not found # mac系统
umi ant-design-pro项目 启动项目npm start提示。当再次启动本地项目npm strat时候就不在提示上面的报错了。3. 运行open命令,打开.bash_profile文件。如果没有.bash_profile文件。,并确保版本是 2.0.0 或以上。4.运行下面命令修改生效。5.再次运行umi -v。问题:# mac系统。
2022-12-13 10:07:35 2039
转载 [uni-app] 从B页面返回A页面,需刷新A页面数据
第二个:在页面中添加返回按钮,执行uni.navigateTo 或者uni.navigateBack。第一个:监听左上角返回。返回A页面有两个办法。
2022-11-29 09:26:37 512
原创 [uni-app] 微信小程序 如何修改替换头像
通过上传接口拿到图片的路径或者跟图片有关的值,再根据这个值调取后端接口拿到base64字符串 【最后还是要看后端开发要怎么设计了,说白了都是从接口里拿到想要的值。在写这块的业务处理逻辑时,个人时感觉某些接口还是有多余设计成分在里面的,此时还是要多根跟后端开发好好商量设计下如何解决才更高效!,方法执行成功后根据success中返回的图片的本地文件路径列表 tempFilePaths,做操作。如下图所示,微信小程序中涉及到修改头像的交互。2.从本地相册选择图片或使用相机拍照。以上完成了头像的修改。
2022-10-24 16:34:51 4407 2
转载 【uniapp】解决uniapp h5 本地代理实现跨域访问及如何配置开发环境
直接创建一个vue.config.js文件,并在里面配置devServer,直接上代码,重启跑项目。判断当前环境是开发环境还是生产环境。一般用于连接测试服务器或生产服务器的动态切换。注意⚠️以上两种解决方法不能同时使用;第二种方案会覆盖第一种解决方法。X 内置浏览器,不存在跨域问题,推荐使用。
2022-10-17 23:13:44 9286
原创 深入解析CSS (2)盒模型
用百分比指定高度存在问题。百分比参考的是元素容器块的大小,但是容器的高度通常是由子元素的高度决定的。这样会造成死循环,浏览器处理不了,因此它会忽略这个声明。
2022-10-08 15:34:09 639
转载 转载 Mac如何彻底卸载node
5. 进入个人主文件夹,检查各种 local、lib、include 文件夹,删除名字含有node和node_modules的文件和文件夹。3. 删除 /usr/local/include 下 node 和 node_modules 目录。4. 删除 /usr/local/bin 下 node 执行文件。2. 删除 /usr/local/lib 下node相关内容。1. 删除 npm 相关内容。
2022-09-15 14:54:41 21283 5
转载 Mac下打开/usr/local目录
Mac下/usr/local目录默认是对于Finder是隐藏,如果需要到/usr/local下去,打开Finder,然后使用command+shift+G,在弹出的目录中填写/usr/local就可以了。
2022-09-15 14:20:56 3734
转载 github.com[xxxx]: errno=Connection timed out
亲测有效,心塞啊 使用多种方式下载依赖都无效,最后选择执行上面的命令才解决了问题!(直接输入这段话就可以,不用去找项目的具体地址)新下载的项目,在安装依赖npm install时。需要用https才能读到数据。fatal: 无法连接到。在git时,出现以上提示。
2022-09-08 16:58:44 1380
转载 微信小程序 区分生产环境和开发环境
wx.getAccountInfoSync(),获取当前帐号信息。线上小程序版本号仅支持在正式版小程序中获取,开发版和体验版中无法获取。
2022-08-18 11:40:45 2209
转载 转载:在微信小程序中 生成二维码
weapp-qrcode-canvas-2d 是使用新版canvas-2d接口在微信小程序中生成二维码(外部二维码)的js包。canvas 2d 接口支持同层渲染且性能更佳,建议切换使用,可大幅提升生成图片的速度。
2022-08-11 17:39:44 3183
原创 rem如何使用
在这个例子里,根元素的字号为浏览器默认的字号16px(根元素上的em是相对于浏览器默认值的)。因为相对根元素,所以所有字号始终一致,就算是嵌套列表也一样。在文档中,根节点是所有其他元素的祖先节点。这等价于类型选择器html,但是html的优先级相当于一个类名,而不是一个标签。一般会用rem设置字号,用px设置边框,用em设置其他大部分属性,尤其是内边距、外边距和圆角。掌握CSS很重要的一点是学会在适当的场景使用适当的工具。rem是root em的缩写。rem不是相对于当前元素,而是相对于根元素的单位。...
2022-08-10 14:49:04 927
原创 深入解析CSS (1)
对于想要精通CSS的人而言,这本书是一张宝贵的“地图”,覆盖了CSS世界的大部分“疆土”,从CSS基础知识开始(如层叠、优先级、继承、相对单位、盒模型等),到多种布局(如浮动布局、Flexbox、网格布局、响应式设计等),再到大型应用程序中的CSS(如模块化CSS和模式库),最后是关于CSS的高级话题(如背景、阴影和混合模式,对比、颜色和间距,以及排版、过渡、变换、动画等)。........................
2022-08-09 09:28:41 708
原创 vscode 编辑器 scss转css如何操作?
编辑index.scss文件并保存,会自动生成index.min.css和index.css这两个文件。首选项-->设置(在设置页面找到setting.json)以上就实现了scss文件转css文件的目的。
2022-07-22 10:29:08 4282
原创 Sass/Scss 入门不慌
SCSS 语法使用 .scss 文件扩展名。除了极少部分的例外, 它是 CSS 的超集,也就是说 所有有效的 CSS 也同样都是有效的 SCSS 。 由于其与 CSS 的相似性,它是最容易上手的语法, 也是最流行的语法。
2022-07-21 11:48:47 1262
原创 关于css的一些基础 :css省略号
以前总是记不住省略号,没有理解透彻「😮💨」css 单行省略号/css多行省略号 单行省略号有三个要素:多行文本省略号:【webkit内核】
2022-07-07 17:01:47 6657 2
转载 css 时间轴样式
51个纯html和css时间轴(包括横向时间轴和纵向时间轴),只有少部分时间轴有用到javascript。示例和下载代码都在zip文件中。
2022-07-05 22:48:19 2518
转载 git 切换/修改 远程仓库地址
1、切换远程仓库地址:方式一:修改远程仓库地址【git remote set-url origin URL】 更换远程仓库地址,URL为新地址。方式二:先删除远程仓库地址,然后再添加【git remote rm origin】 删除现有远程仓库【git remote add origin url】添加新远程仓库2、【git remote -v 】查看远程仓库的地址本文转载地址:git 切换远程仓库地址_涵一的博客-CSDN博客_git 切换源地址...
2022-05-23 21:54:33 13736
转载 MacOS LibreSSL SSL_connect: SSL_ERROR_SYSCALL in connection to github.com:443
在提交git或者git clone的时候出现了下面的错误:LibreSSL SSL_connect: SSL_ERROR_SYSCALL in connection to github.com:443然后尝试git clone其他的仓库,也是报这个错误。第一种解决方法:(因涉及到修改的地方https有些命令不清楚,不敢冒然删掉)vim ~/.gitconfig把里面关于https的配置删掉,然后就可以了,原来代理配置被写入到了文件,难怪一直git用不了。第二种解决办法:(亲测有效)
2022-05-19 10:44:02 3065 1
转载 element UI修改组件的默认样式-转载
element UI修改组件的默认样式,方法有三种:新建global.css,并在main.js中引入import “./assets/style/global.css”; 在单个xx.vue文件最后多写一对标签,即有两对style标签,一对有scoped,一对没有scoped。如果写在有scoped属性的style标签里:覆盖的样式不会生效! 通过deep属性去控制,可以不用新建style标签,最方便通过这三种方法,在文件中编写css去覆盖原来的样式,可以通过添加 !important 修饰符提
2022-05-17 09:18:16 1678
原创 如何查看typescript版本,安装指定typescript版本,卸载typescript
WARNING: You are currently running a version of TypeScript which is not officially supported by typescript-estree.You may find that it works just fine, or you may not.SUPPORTED TYPESCRIPT VERSIONS: >=3.2.1 <3.6.0YOUR TYPESCRIPT VERSION: 3.9....
2022-05-13 09:27:35 4487 1
原创 基础 Element-plus-vite-vue3
这里搭建一个基础的Element-plus-vite-vue3 项目作为练习记录,后续还会继续更新该篇文章加入一些其他功能。这里使用pnpm替代npm1. pnpm的安装:# 这里指定了pnpm的版本 7.0.0npm install -g pnpm@next-7# npm install -g pnpm注意⚠️:pnpm 安装需要Node.js版本 >= 14.19.02. 安装好后验证pnpm是否安装成功pnpm -v #7.0.0如果你...
2022-05-07 09:50:26 1125 1
转载 .browserslistrc 文件解析
为什么需要:根据提供的目标浏览器的环境来,智能添加css前缀,js的polyfill垫片,来兼容旧版本浏览器。避免不必要的兼容代码,以提高代码的编译质量。支持的插件: 组件名 功能vv Autoprefixer postcss添加css前缀组件 bable-preset-env 编译预设环境 智能添加polyfill垫片代码 postcss-normalize
2022-05-05 17:39:34 1580
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人