woowen！-CSDN博客

原创使用javascript 点击tab栏切换事件代码记录

1. javascript 点击tab栏动态切换内容，并添加active。2. javascript 点击左右图标可以向左或者向右移动元素。第2点功能，改变ul的style，tanlateX 移动。

2023-11-27 16:23:39 650

原创 Ant Design Pro 前端脚手架配置混合导航

点击查看阅读混合导航：顶部导航和侧边栏导航实现联动效果，点击不同的顶部导航按钮会显示对应的子菜单项。实现点：1. 路由的配置。

2023-08-17 09:38:53 845

该命令将引导你完成一些配置选项，例如你是否希望使用风格规范，使用哪种风格规范（如 Airbnb、Standard 等），以及支持哪种 JavaScript 版本等。选择适合你项目的配置选项即可。通过以上步骤，你就可以将 ESLint 成功集成到你的项目中，从而在代码开发过程中实现更好的代码质量控制。加入 ESLint 校验是一个很好的做法，它可以帮助你在项目中发现潜在的代码错误和风格问题，从而提高代码质量和可维护性。在这个文件中，你可以对 ESLint 进行更多的配置，例如添加/修改规则，配置插件等。

2023-07-03 17:13:52 486

原创【ProComponents】如何修改ProForm的默认按钮

ProForm 是一个 React 表单库，它提供了一些默认的表单按钮，比如“提交”和“重置”按钮。如果你想修改这些默认按钮，你可以使用 ProForm 的。函数来定义自定义的提交和重置按钮。这两个函数的第一个参数是一个包含一些属性的对象，包括表单对象。注意，在使用自定义按钮时，你需要自行处理表单的提交和重置逻辑。在上面的示例代码中，我们使用了。属性，这两个属性允许你自定义表单按钮的文本、样式和事件处理程序。这些属性可以被用来定制按钮的文本和事件处理程序。组件，以便将它们用于渲染表单的提交和重置按钮。

2023-04-18 17:56:45 1947 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 379

原创【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 5274 5

原创【vite+vue3】多页面应用模式

访问地址变为localhost/src/project/portalProject/index.html。的值将仍然是 vite.config.js 文件所在的目录。因此，你需要把对应入口文件的。在开发过程中，简单地导航或链接到 src/project/projectA。注意⚠️在运维部署时，访问该html，需要多写点路径才能正常访问。- 将会按预期工作，与正常的静态文件服务器表现一致。如果你指定了另一个根目录，请记住，在解析输入路径时，假设你有下面这样的项目文件结构。npm run dev 即可。

2023-04-06 22:38:04 1324

原创 es6 按照不同条件导入不同模块

函数来导入模块，并返回一个 Promise 对象。在使用时，我们可以根据不同的条件调用。我们可以使用条件语句和动态导入的方式来实现这一功能。注意，我们使用了动态导入的方式，即使用。在上面的代码中，我们定义了一个。）动态导入不同的模块。函数，并在 Promise 的。函数，根据不同的条件（方法中使用相应的模块。

2023-04-03 22:41:14 300

翻译浏览器控制台报错：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 511

原创【css】深入解析CSS （4）网格布局

设置为display: grid的元素成为一个它的子元素则变成。

2022-12-29 14:48:41 737

原创【css】深入解析CSS （5）定位和层叠上下文

跟固定或者绝对定位不一样，不能用top、right、bottom和left改变相对定位元素的大小。这些值只能让元素在上、下、左、右方向移动。可以用top或者bottom，但它们不能一起用（bottom会被忽略）。跟固定元素一样，属性top、right、bottom和left决定了元素的边缘在包含块里的位置。定位一个元素时，不要求指定四个方向的值，可以只指定需要的方向值，然后用width和/或height来决定它的大小，也可以让元素本身来决定大小。这些属性的值决定了固定定位的元素与浏览器视口边缘的距离。

2022-12-27 16:36:52 184

原创深入解析CSS （3）Flexbox

Flexbox，全称弹性盒子布局给元素添加display: flex，该元素变成了一个（flex container），它的直接子元素变成了弹性子元素默认是在同一行按照从左到右的顺序并排排列。弹性容器像块元素一样填满可用宽度，但是弹性子元素不一定填满其弹性容器的宽度。弹性子元素高度相等，该高度由它们的内容决定。flex属性控制弹性子元素在主轴方向上的大小（在这里指的元素的宽度）flex属性是三个不同大小属性的简写：flex-grow、flex-shrink和flex-basis。

2022-12-19 17:35:50 435

转载【 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 1943

转载 [uni-app] 从B页面返回A页面，需刷新A页面数据

第二个：在页面中添加返回按钮，执行uni.navigateTo 或者uni.navigateBack。第一个：监听左上角返回。返回A页面有两个办法。

2022-11-29 09:26:37 441

原创【vue】前端获取用户真实IP地址（外网IP地址）

1. 打开index.html

2022-11-28 16:11:57 3158 1

原创 [uni-app] 微信小程序如何修改替换头像

通过上传接口拿到图片的路径或者跟图片有关的值，再根据这个值调取后端接口拿到base64字符串【最后还是要看后端开发要怎么设计了，说白了都是从接口里拿到想要的值。在写这块的业务处理逻辑时，个人时感觉某些接口还是有多余设计成分在里面的，此时还是要多根跟后端开发好好商量设计下如何解决才更高效！，方法执行成功后根据success中返回的图片的本地文件路径列表 tempFilePaths，做操作。如下图所示，微信小程序中涉及到修改头像的交互。2.从本地相册选择图片或使用相机拍照。以上完成了头像的修改。

2022-10-24 16:34:51 4145 2

转载【uniapp】解决uniapp h5 本地代理实现跨域访问及如何配置开发环境

直接创建一个vue.config.js文件，并在里面配置devServer，直接上代码，重启跑项目。判断当前环境是开发环境还是生产环境。一般用于连接测试服务器或生产服务器的动态切换。注意⚠️以上两种解决方法不能同时使用；第二种方案会覆盖第一种解决方法。X 内置浏览器，不存在跨域问题，推荐使用。

2022-10-17 23:13:44 8418

原创深入解析CSS （2）盒模型

用百分比指定高度存在问题。百分比参考的是元素容器块的大小，但是容器的高度通常是由子元素的高度决定的。这样会造成死循环，浏览器处理不了，因此它会忽略这个声明。

2022-10-08 15:34:09 612

转载 git 命令行指令---git仓库

已存在的 Git 版本库。

2022-09-16 11:03:40 130

转载转载 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 20946 5

转载 Mac下打开/usr/local目录

Mac下/usr/local目录默认是对于Finder是隐藏，如果需要到/usr/local下去，打开Finder，然后使用command+shift+G，在弹出的目录中填写/usr/local就可以了。

2022-09-15 14:20:56 3505

转载 github.com[xxxx]: errno=Connection timed out

亲测有效，心塞啊使用多种方式下载依赖都无效，最后选择执行上面的命令才解决了问题！（直接输入这段话就可以，不用去找项目的具体地址）新下载的项目，在安装依赖npm install时。需要用https才能读到数据。fatal: 无法连接到。在git时，出现以上提示。

2022-09-08 16:58:44 1310

原创微信小程序 camera组件实现自定义界面的扫码功能

效果图：想要实现自定义界面的扫码，这里用到了微信小程序的媒体组件。

2022-08-18 15:11:21 3726 5

转载微信小程序区分生产环境和开发环境

wx.getAccountInfoSync(),获取当前帐号信息。线上小程序版本号仅支持在正式版小程序中获取，开发版和体验版中无法获取。

2022-08-18 11:40:45 2078

转载转载：在微信小程序中生成二维码

weapp-qrcode-canvas-2d 是使用新版canvas-2d接口在微信小程序中生成二维码（外部二维码）的js包。canvas 2d 接口支持同层渲染且性能更佳，建议切换使用，可大幅提升生成图片的速度。

2022-08-11 17:39:44 3053

原创 rem如何使用

在这个例子里，根元素的字号为浏览器默认的字号16px（根元素上的em是相对于浏览器默认值的）。因为相对根元素，所以所有字号始终一致，就算是嵌套列表也一样。在文档中，根节点是所有其他元素的祖先节点。这等价于类型选择器html，但是html的优先级相当于一个类名，而不是一个标签。一般会用rem设置字号，用px设置边框，用em设置其他大部分属性，尤其是内边距、外边距和圆角。掌握CSS很重要的一点是学会在适当的场景使用适当的工具。rem是root em的缩写。rem不是相对于当前元素，而是相对于根元素的单位。...

2022-08-10 14:49:04 896

空空如也

空空如也