- 博客(16)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 element-ui 的switch组件如何让文字显示在按钮上
本文介绍了如何修改el-switch组件的样式，使其只显示当前选中状态的文字。通过CSS样式调整，隐藏所有文字标签，仅展示激活状态的文字并居中显示。关键步骤包括：1）设置.el-switch__label为隐藏；2）为.is-active状态的文字设置显示样式；3）调整禁用状态文字位置避免重叠。文章提供了完整的组件代码和样式修改方案，实现更简洁的开关状态展示效果。
2025-08-26 11:08:30
337
原创 mac电脑如何配置java环境
摘要：本文介绍了JDK安装配置的三个步骤：1)从openjdk官网下载安装JDK；2)配置环境变量，包括查找JDK安装路径、创建编辑.bash_profile文件、设置JAVA_HOME等变量；3)通过java -version命令验证安装是否成功。配置过程详细说明了macOS系统下的环境变量设置方法，包括路径获取、文件编辑和变量导出等关键操作。
2025-07-09 09:11:11
234
原创 vue系统升级后自动刷新浏览器（纯前端）
摘要：本文介绍了一种基于版本号强制刷新浏览器的方法，适用于Vue2项目。通过在public文件夹创建appVersion.json存储版本号，并在打包时自动更新版本号（使用updateVersion.js）。路由跳转时对比缓存版本号与新版本号，不一致则强制刷新。具体实现包括：1)创建版本文件；2)编写更新脚本；3)路由监听；4)修改打包命令；5)服务器缓存配置。该方法确保用户始终访问最新版本，解决浏览器缓存问题。
2025-02-26 14:07:40
655
原创 如何使用nvm切换node版本
前端开发的时候，不同的项目可能需要使用不同的node版本。这个时候需要在本地安装不同的node版本，启动不同项目的时候，根据需要切换node版本。可以使用nvm进行node版本管理。windows版本下载地址如下：https://github.com/coreybutler/nvm-windows/releases。选择合适的版本安装。
2025-01-02 14:55:53
493
原创 左右两个盒子高度不一致时，分割线高度随高的盒子变化
后来用了定位的方法实现，将中间分割线单独拎出来，高度设置为父级高度，做出来就比较美观了,，分割线高度会随着左右两边高度的变化自适应。最开始做的时候是用左边盒子的padding-right实现的，后来发现当右边比左边高时，分割线会比较短，类似下图，不美观。最近在做这样一个功能，左右两边分开展示不同的内容，中间用分割线分开。
2024-12-24 14:20:57
316
原创 ant design of vue的a-table设置defaultExpandAllRows不生效
解决方法，给a-table加一个key值，每次刷新数据的时候，更新key。
2024-10-11 10:47:19
572
1
原创 接口未确定时，前端如何做测试（以抖音小程序开发为例）
以抖音小程序开发为例，前端在编写api文件时，同时建立一个mock文件，api文件和mock文件中编写同样的方法，不同是api文件中的方法返回接口数据，mock文件中的方法返回测试数据。如果测试数据直接写在页面上的话，看起来不美观，而且直接写测试数据，不写接口请求方法，等到后端接口写好之后，前端再删掉测试数据重新写请求接口的方法，费时费力。在系统运行的时候，app.js文件中引入mock文件。等到后端接口完毕时，直接修改app.js引入的mock文件为api文件，再次请求到的数据就是真实的接口数据了。
2024-05-29 11:13:59
298
原创 html语义化
html语义化，顾名思义，就是通过阅读html代码，就可以知道代码代表的意义。html中，大部分标签都有自己的语义，比如。表示paragraph（段落），表示image（图像）,
2024-01-04 16:28:01
501
1
原创 子元素宽高设置为100%后，宽高都超出父级
而使用绝对定位时，子集元素的宽高是根据父级元素的padding盒子计算的，也就是说子集的宽度 = 父级左padding + content + 父级右padding，子集的高度 = 父级上padding + content + 父级下padding。当元素没有进行定位时，子集元素设置的宽度和高度的百分比，是根据content区计算的，也就是说，没有把padding、border计算进去。最近写样式遇到了如下现象：子集设置宽高为100%，但是溢出了父级，如下图所示。通过查阅资料，获知了原因。
2023-11-22 15:22:36
2759
1
原创 border-radius知识点详解，包含如何画圆、如何画椭圆，并且实现用css画一个哆啦A梦
用到的知识点：border-radius知识点说明：border-radius有四个方向（左上、右上、右下、左下）、两个半径（水平半径、垂直半径）。写birder-radius属性的时候，先写水平半径，再写垂直半径，中间用/隔开。例如：border-radius: 10px 10px 20px 20px / 10px 10px 20px 20px分别表示：左上水平半径 右上水平半径 右下水平半径 左下水平半径 / 左上垂直半径 右上垂直半径 右下垂直半径 左下垂直半径省略的写法和padding、m
2022-05-31 15:21:06
1160
1
原创 微信小程序实现省市区三级联动
实现效果如图所示jsconst app = getApp()const api = require('../api')Page({ /** * 页面的初始数据 */ data: { successCode:0, imageUrl:app.imageUrl, iconColor:app.iconColor, id:0,//正在编辑的地址的id,0表示新增 detail:{//当前正在添加/编辑的地址的信息 name: "",//
2021-11-12 15:27:48
2396
原创 CSS小技巧：使用伪类控制border的长度，实现div之间的分割线
给div设置border时，border属性中有border-width属性可以控制border的宽度，但是没有控制border长度的属性。如果边框的长度和div的高度一致时，直接设置border:1rpx solod #ccc类似样式即可。但想实现如下图所示，border的长度和div的高度不一致，可以使用伪类实现。代码如下：html<div class="action"> <div class="action-item"> <div class=
2021-09-03 15:00:26
4617
原创 从零创建一个vue项目（基于vue2.X，以windows系统为例）
1.安装nodejs,安装方法参见：2.将nodejs和vue的路径加入环境变量3.执行vue create projectName 创建项目，为保证后续安装其他组件方便，vue版本选2.X4.执行npm run serve ，编辑器提示访问地址，一般是 http://localhost:8080/，看到 Welcome to Your Vue.js App 的界面就算成功了。5.根据实际需要，安装UI框架，例如ant design of vuenpm install ant-design-vue
2021-08-13 11:27:04
703
原创 安装nodejs和npm
1.安装nodejs,安装方法参见：https://www.runoob.com/nodejs/nodejs-install-setup.html 安装nodejs会同时安装npm，安装完毕后查看nodejs和npm的版本号，方法为：按住键盘的win+r键，在弹出的窗口中输入cmd，然后回车。在新的弹窗中输入 npm -v，或nodejs --version 然后回车，即可查看npm版本、nodejs版本...
2021-08-13 11:23:36
807
原创 div中的文本只显示一行，多出的部分展示省略号，不同高度的div方法有不同
若容器有固定的宽高：overflow: hidden;white-space: nowrap;text-overflow: ellipsis;若容器没有固定的宽高：display: -webkit-box;overflow: hidden;text-overflow: ellipsis;word-break: break-all;-webkit-box-orient: vertical;-webkit-line-clamp: 1;//此处为行数，可以改为任意数字...
2021-08-03 09:37:58
1025
原创 使用phpstudy在windows系统部署vue打包后的项目，在局域网内通过IP:端口号的形式访问
部署方法假设本机的ip为192.168.1.136，部署方法如下：1.在phpstudy上配置上网站，设置好虚拟域名（不会的可以百度phpstudy的手册）2.phpstudy修改配置2.1.点击菜单栏“设置-配置文件-httpd.conf” 里面取消注释以下三行#LoadModule proxy_module modules/mod_proxy.so#LoadModule proxy_http_module modules/mod_proxy_http.so#LoadModule rewr
2021-07-30 14:51:27
2322
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人