vue技术项目相关文章
在开发vue项目过程中遇到的问题、插件的使用、组件的弊端和解决方案等相关文章
抠脚小弟
没有激流就称不上勇进,没有山峰则谈不上攀峰!
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
实现vue组件库并发布npm上使用流程
本文摘要: 详细介绍了如何创建并配置Vue3+TypeScript+Vite组件库项目。主要内容包括: 项目初始化及依赖安装(@types/node、vue-jsx插件、dts插件) 目录结构调整,创建组件开发目录 开发示例按钮组件,包含类型定义和样式 全局组件注册配置 TypeScript配置文件优化 Vite打包配置详解,包括lib模式、dts声明文件生成等 组件测试方法 项目适用于开发可发布的npm组件库,提供完整的开发流程和配置方案。原创 2025-06-10 09:53:53 · 1239 阅读 · 0 评论 -
前端养成记-实现一个低配版简单版本的vue3表单自定义设计组件
通过使用了最新的vue3,vite2,TypeScript等主流技术开发,并配合使用vuedraggable 插件以及antd design vue 组件库实现低配版本的自定义表单设计组件;项目地址:https://gitee.com/hejunqing/vue3-antdv-generator。原创 2024-07-25 16:55:05 · 415 阅读 · 0 评论 -
elementUI组件el-input输入框只能输入数字或保留两位小数
只能输入数字的两种方法:方法一:使用type=“number”<el-input v-model.number='count' type='number' maxlength='9'/>缺点:maxlength不生效可以输入e可以输入小数点方法二:使用正则表达式<el-input v-model.number='count' oninput="value=value.replace(/[^\d]/g,'')" maxlength='9'/>其中v-model.n转载 2021-04-21 14:27:31 · 19197 阅读 · 2 评论 -
如何获取到element ui 中Cascader 级联选择器里label的值
给 cascader 组件一个别名,然后用 this.$refs[关联组件名].currentLabels 就能取到选中的 labelshttps://www.jianshu.com/p/29b...<el-cascader ref="myCascader" placeholder="可输入地区名字搜索,例如:北京" @change="onProvincesChange"></el-cascader>原创 2020-06-08 09:05:59 · 2626 阅读 · 7 评论 -
vue:element.ui中两日期时间范围选择在同一个月内
copy的一份代码,做个笔记此功能只适合选择一个月内任意日期,不能跨越到下个月,最长为30天。在pickerOptions里写下面的代码:onPick: ({ maxDate, minDate }) => { this.choiceDate = minDate.getTime() if (maxDate) { this.choiceDate = '' }},disabledDate: (time) => { const原创 2020-06-01 00:48:04 · 2512 阅读 · 3 评论 -
element的弹窗滚动条重置问题
element的弹窗滚动条重置问题弹窗出现滚动条的时候滚动到最底下,下次在点开的时候还在最底下,可以通过以下方式解决<el-dialog :title="formTitle" :visible.sync="dialogFormVisible" :lock-scroll="false" //主要是这个属性 :append-to-body="true" //跟这个属性 :close-on-click-modal="false" width="10转载 2022-05-27 11:43:22 · 1407 阅读 · 0 评论 -
vue element ui input 正则验证,限制只能输入数字和小数输入
验证只能输入数字oninput="value=value.replace(/[^\d]/g,'')"1验证只能输入数字和小数,小数且只能输入2位,第一位不能输入小数点oninput="value=value.replace(/[^\d.]/g, '').replace(/\.{2,}/g, '.').replace('.', '$#$').replace(/\./g, '').replace('$#$', '.').replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$转载 2021-04-23 09:20:49 · 8549 阅读 · 0 评论 -
vue-element-admin项目表格单元格多行文字单独做省略并文字提示组件
针对element表格使用el-tooltip时不管文字是否省略都会提示的解决首先创建TextTips.vue文件,直接上代码:<template> <!-- 文字提示 --> <div class="TextTips"> <el-tooltip placement="top" v-if="TextWidth > TotalWidth"> <div slot="content"> <spa原创 2021-09-28 11:06:59 · 485 阅读 · 0 评论 -
Admin Pro 去除水印
将import { default as WaterMark } from ‘@/components/watermark/index.vue’;找到src/layouts文件夹目录下的index.vue。同时将组件也注释掉WaterMark,原创 2022-08-19 16:30:09 · 649 阅读 · 0 评论 -
在vue项目中引用萤石云播放器插件
在vue项目中引用萤石云播放插件原创 2022-07-11 16:02:10 · 4225 阅读 · 3 评论 -
根据element改造的文件预览组件:支持图片、doc、xlsx、ppt、PDF、视频等文件预览
element-ui框架的预览只能预览图片,其他文件不支持,不支持就自己封装一个吧,前提条件后端返回的文件预览支持访问首先在component中新建文件:FilePreview.vue:内容如下<template> <!-- 预览组件 --> <div class="FilePreview"> <div class="container"> <!-- 渲染层 --> <div class="obje原创 2021-09-28 11:42:05 · 3337 阅读 · 10 评论 -
记录使用vue3+typescript+ant-design-vue踩坑组件缺少类型报错
原因:在tsconfig.json中,"exclude"选项用于指定应该排除在TypeScript编译过程中的文件或目录。在这个特定的例子中,“exclude”: [“node_modules/ant-design-vue/lib/**”]的作用是排除Ant Design Vue库中的源代码文件。虽然不影响代码的运行,但是看着那红色的下划线就让人很抓狂,于是经过了努力的查找问题所在点终于找到了问题点处在“直接排除整个的ant-design-vue组件库,就不会去针对对应的组件去进行ts编译;原创 2023-07-24 23:51:52 · 1229 阅读 · 0 评论 -
使用vue框架直接上传文件到七牛云的过程
前段时间刚好做到这个需求在这里记录一下希望能帮助到大家!首先可以先看看七牛云的开发者中心:七牛云开发中心我这里是使用vue3.x+ts框架开发的按照文档所说我们需要先安装一下七牛云的SDKnpm install qiniu-js然后在页面上引入:const qiniu = require('qiniu-js')// orimport * as qiniu from 'qiniu-js'使用的是antd的上传组件:(我给封装起来了:UploadDragger)<a-drawer原创 2021-11-25 11:28:09 · 3929 阅读 · 0 评论 -
vue3+qrcode插件实现下载二维码图片(.png、.svg格式)
注释:qrcode可通过canvas的toDataURL方法下载对应的png图片,比较恶心的是下载svg格式(必须记录一下)这里暂未实现封装,感兴趣的可以自己考虑一下封装。原创 2022-12-13 18:22:46 · 2420 阅读 · 1 评论
分享