- 博客(28)
- 收藏
- 关注
RSS订阅原创 Vue 3 中使用 Element Plus 的 `el-table` 组件实现自适应高度
在 Vue 3 中使用 Element Plus 的 `el-table` 组件实现自适应高度，你可以根据容器的高度动态设置表格的高度。通常的做法是监听窗口大小的变化，并相应地调整表格的高度。
2024-09-27 18:46:47
1745
1
原创 vue2使用el-table表头吸顶效果
//使用自定义指令<el-table-column prop="date" label="达人" show-overflow-tooltip>
2024-06-26 10:22:33
584
原创 vue2上传附件
效果1.2.点击文本域的时候放大宽度3.4.上传成功的效果实现代码它包含了一个文本域和一个文件上传组件。以下是详细解析：1. **文本域（`el-input`）**:- `resize="none"` 设置文本域不可调整大小。- `:autosize="autosize"` 使文本域自动调整尺寸以适应内容。- `type="textarea"` 指定输入类型为多行文本域。- `placeholder="请输入内容"` 设置文本域的占位符。
2024-05-20 16:27:08
1409
原创 vue2使用el-date-picker（无输入框版）
这意味着元素在页面上是存在的，但是对用户是不可见的。在这个ui组件中建议不要使用display: none属性会导致日历选择错位。这个属性设置了一个元素的。
2024-05-20 15:17:28
1693
原创 vue2实现导入excel文件
这种类型的响应格式通常用于处理非文本文件，比如图片、PDF文件、Excel文件等二进制格式的数据。失败时处理异常，生成包含错误信息的 Excel 文件并提供下载，显示上传失败的消息，并关闭 loading 状态。是JavaScript中的一种数据类型，用于表示通用的、固定长度的原始二进制数据缓冲区。的方法，该方法使用 Axios 发送 POST 请求，上传文件到指定的接口。:使用 Element UI 框架的上传组件，用于处理文件上传的相关操作。: Element UI 按钮组件，触发文件选择的操作。
2023-12-11 18:03:46
596
原创 vue2使用小记
这样做的好处是，如果这些样式需要根据特定逻辑或数据动态变化，可以将其定义为计算属性，从而使得样式可以根据数据的变化而动态更新，而不需要手动编写复杂的逻辑来实现样式的动态变化。，它返回一个对象，其中包含了一些用于定义表头样式的属性，比如字体颜色、字体大小、字体样式等。，它返回一个对象，其中包含了一些用于定义表格内容样式的属性，比如字体大小、内边距、外边距等。multiple：可以多选，传递的值为数组格式，不写默认单选传递的值为字符串。用来定义表头单元格和普通单元格的样式。属性来定义计算属性。
2023-12-02 17:39:57
545
原创 表格插入echarts折线图
通过npm或者直接引入ECharts的CDN来进行安装。在表格中为echarts准备一个容器dom,注意点我这里使用的是id来绑定图表只要是唯一属性皆可。创建一个Vue组件来包裹表格和ECharts折线图。在该组件中，需要引入ECharts组件。通过自定义插槽或其他方式，在表格中插入ECharts折线图。初始化图表，然后设置图表的样式、数据等属性，最后通过。钩子函数：当组件被挂载时调用，里面调用了。方法使用 ECharts 绘制图表。方法初始化了表格的数据，而。ECharts 图表：通过。
2023-12-02 17:00:09
906
原创 总结一下GPT在前端开发中的影响和意义
随着人工智能技术的快速发展，GPT等大型语言模型在各个行业中的应用越来越广泛。对于前端开发工程师而言，GPT已经成为了一个得力的助手，帮助他们更高效地完成各项工作。那么，前端开发工程师们在使用GPT时都面临什么场景？总之，GPT已经成为前端开发工程师们不可或缺的助手。通过在需求分析、代码生成、故障排查和自动化测试等场景中使用GPT，工程师们可以提高效率、增强能力并减少错误。同时，使用百度大脑、微信小程序和云端平台等平台可以让开发者更加方便地使用GPT接口，从而更好地实现应用程序的功能和性能。
2023-10-27 16:37:12
634
1
原创 vue2使用钉钉扫码登录最新版
需注意如果报错DDLogin未定义，需要将此代码放入head中或者body中，放在body-html标签之间有些项目会报错。dingRedirectUrl属于重定向地址 钉钉开发者后台中生成。在public/index.html引入钉钉js。其中appKey由钉钉提供在钉钉开发者后台中。在登录页创建一个div盒子用来放置二维码。
2023-09-15 12:00:31
1165
7
原创 vue2使用el-table小结
循环生成加固定列,导致横向滚动条失效,表格被固定住了 改变这个固定列盒子距底部的距离，致使不遮住滚动条。4. element-ui改变table表格中点选行的颜色（highlight-current-row）首先使用 highlight-current-row。2.给表格中的图片添加点击或悬浮放大功能。然后在app.vue样式中编写一下代码。检查el-table是否设置固定高度。3.table表格嵌套下拉选项框。一定要在App.vue中！
2023-09-01 18:32:08
247
1
原创 Vue2实现钉钉登录
点击"钉钉登录"按钮后，将会跳转到钉钉授权页面，完成授权并返回回调页。在回调页上，你将看到登录成功的提示以及用户的基本信息。为你的实际值，同时确保你在钉钉开放平台中设置了正确的回调URL和权限。文件来存储环境变量，其中包括钉钉应用的。组件来处理钉钉登录回调并获取用户信息。1.在根目录下创建一个。
2023-08-15 16:47:35
585
1
原创 404和500错误时的跳转自定义页面
3.在需要捕获404和500错误的地方，例如在主应用组件或者根组件中，可以添加一个路由守卫，通过判断错误类型来跳转到对应的自定义页面。首先，创建一个自定义的404页面组件和500页面组件。可以在项目中的某个目录下创建这两个组件文件，例如。4.在应用中的其他需要处理500错误的地方，例如在接口请求的错误处理函数中，可以通过跳转到。）中，导入创建的自定义组件，并添加相应的路由配置。路径来显示自定义的服务器错误页面。在路由配置文件（通常是。
2023-08-09 17:42:18
1093
1
原创 vue2鉴权处理
编写鉴权逻辑：在全局前置守卫中，你需要编写实际的鉴权逻辑。可以根据具体业务需求进行判断，比如判断用户是否已登录、是否具有特定的角色权限等。为true的权限可以使用，includes(role)判断mate字段中的requiresAuth是否为true。防止在超级管理员退出登录的时候普通员工登录可以暂时性访问超级管理员页面。使用路由表：在Vue组件中，你可以使用Vue Router提供的。从本地存储获取权限数据，并对按钮v-if设置权限。用于生成一个带有路由路径的链接，用于编程式导航到指定的路由。
2023-08-09 17:37:53
256
1
原创 获取el-table表格中选中行的数据
这个数组将包含选中的行的所有数据对象。在该方法中，将选中的行数据保存在。事件监听，当选择行发生变化时，会触发。
2023-07-31 15:12:32
9520
1
原创 vue2数据持续化存储插件使用详细过程
需要注意的是，`vuex-persistedstate`和`vue-ls`都可以实现数据持续化存储，但它们的使用方式和配置略有不同。你可以根据自己的需求选择适合你的插件。要在Vue 2中实现数据持续化存储，可以使用插件如`vuex-persistedstate`或`vue-ls`。3. 现在，当你的Vue应用程序中的状态发生变化时，`vuex-persistedstate`插件将自动将状态存储到本地存储中。3. 在你的Vue组件中，你可以通过`this.$ls`访问本地存储。
2023-07-25 11:25:10
735
原创 windows系统上传vue2项目到服务器流程
3.2修改conf下的nginx.conf文件用记事本打开修改server中的配置信息根据自身情况修改。一、打包文件生成dist文件夹 npm run npm run build。四、保存之后重启nginx双击 屏幕一闪代表启动成功 也可以用命令重启。3.1将dist文件夹中的所有文件放在html中。三、完成之后使用nginx将项目推送服务器。命令启动 start nginx。二、使用xftp连接服务器。
2023-07-25 11:18:22
310
原创 浏览器兼容性问题
一些浏览器可能支持更多的API，而另一些可能支持较少的API，或根本不支持某些API。- 在进行跨浏览器测试时，使用浏览器兼容性工具和在线服务，如Can I use、BrowserStack和CrossBrowserTesting，以确保在不同浏览器中的一致性和正确性。3. Flexbox和Grid布局： CSS中的Flexbox和Grid布局在不同浏览器中的支持程度也有所差异。7. 字体和文本渲染：不同浏览器对字体和文本的渲染方式也有所差异，可能导致字体大小、字体样式和字体渲染效果的差异。
2023-06-30 17:44:07
79
原创 前端处理跨域问题
服务器可以设置 `Access-Control-Allow-Origin` 来指定允许访问的源，也可以设置其他的 CORS 相关头部，如 `Access-Control-Allow-Methods` 和 `Access-Control-Allow-Headers`，以控制请求方法和自定义头部的允许。对于简单的跨域请求，CORS 是推荐的解决方案。此外，为了安全起见，在跨域请求时，应尽量限制请求来源和允许的方法，以防止潜在的安全问题。这样，前端请求的实际接口与前端代码所在的域名相同，就避免了跨域问题。
2023-06-30 17:39:57
1067
原创 Vue全家桶都包含那些东西有什么用处
1. Vue-test-utils：Vue-test-utils是Vue.js的官方测试工具库，用于编写单元测试和集成测试。4. Vue CLI：Vue CLI是Vue.js的官方命令行界面，提供了初始化Vue.js项目、调试、打包、部署等开发过程中必备的工具。2. Vue Router：Vue Router是Vue.js的官方路由库，用于在单页面应用程序中管理路由。2. Vue-devtools：Vue-devtools是一个浏览器扩展程序，用于调试和分析Vue.js应用程序。
2023-06-20 19:52:50
418
原创 css浏览器兼容性
1. 使用CSS前缀：有些浏览器需要添加特定前缀才能支持某些CSS属性和值，比如-webkit-和-moz-前缀。以上仅是CSS中一些常见的属性和值在主流浏览器中的兼容性情况，实际的情况还会更加复杂，需要根据具体的需求进行兼容性处理。5. @font-face： 这个属性可以实现自定义字体的效果，不过在IE 8及以下版本中不支持该属性，需要使用其他解决方案。总之，了解浏览器兼容性，在设计和开发CSS样式时，需要尽量保证不同浏览器间的一致性，提高网站的用户体验和可访问性。
2023-06-20 19:51:05
845
原创 WebSocket配置
在实现WebSocket服务端时，需要查看具体的WebSocket服务端实现，确认支持的WebSocket协议版本号，并进行相应的配置。在WebSocket连接建立后，服务端和客户端可以互相发送心跳包，以保证连接的活性。3. 实现心跳包发送和接收机制：通过WebSocket客户端和服务端提供的接口函数实现心跳包的发送和接收机制，并根据具体的应用场景进行相应的调整。5. WebSocket心跳包：由于WebSocket连接是持久化的，需要保证连接的稳定性，服务端和客户端通常需要配置心跳包机制来维护连接。
2023-06-19 08:24:45
5818
原创 vue项目打包白屏解决
如果使用了 Vue Router history 模式，在打包后需要配置服务器，以避免出现404错误。在 Vue 项目中，打包后会生成一个 dist 目录，确保 index.html 引用的资源路径都是相对于 dist 目录的。如果在本地测试时没有问题，但是打包后出现了白屏，可能是因为本地使用了服务器，但是打包后未启动服务器，需要手动启动服务器。如果打包后出现了白屏，可能是因为路由没配置正确。可以检查路由文件是否正确引入、是否正确配置了路由及其子路由等。如果没有生成，说明打包过程出现了问题。
2023-06-13 11:21:49
10134
2
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人