前端
文章平均质量分 68
落魄实习生
这个作者很懒,什么都没留下…
展开
-
vue3+ts使用pinia状态管理
最后总结一下pinia一些优点舍弃了冗长的 mutations 属性舍弃了模块化 modules 让状态管理更加扁平化对于 ts 的支持更加友好 支持数据推断你甚至可以让各个状态管理相互依赖、嵌套。转载 2023-11-28 13:13:14 · 581 阅读 · 0 评论 -
vue3集成Tailwind Css
Tailwind Css 是由 JavaScript 编写的 Css 框架,基于PostCss 解析类名驱动文档生产环境体积很小,编译后只有 8.7KB支持 栅格、hover/focus、深色模式等可以通过 apply 指令实现自定义类名支持前沿样式属性,比如很多浏览器不支持 grid 属性,但此框架帮我们做了转换写代码时在 VSCode 里有提示。转载 2023-11-28 11:54:04 · 720 阅读 · 0 评论 -
学习Vue3你需要知道的47个实用开源组件
antfu按需组件自动导入,开箱即用地支持Vue2和Vue3,Tree-shakable,只注册你使用的组件,附有流行UI库的内置解析器。基于Vue3+Vite+Canvas开发的滑块验证码,动态生成验证滑块,结合后端的二次校验,能有效的避免被抓取模拟验证。基于谷歌的MaterialDesign,附带Vue插件和指令,以及从简单到复杂的高度可定制组件。字节跳动出品,将一个SVG图标转化为多个主题,并生成React图标,Vue图标,svg图标。Vue3.x的UI组件库,完全使用TypeScript开发。转载 2023-11-28 11:20:46 · 365 阅读 · 0 评论 -
springboot整合webSocket
WebSocket是一种在单个TCP连接上进行全双工通信的协议。WebSocket使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。在WebSocket API中,浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接,并进行双向数据传输。转载 2023-10-12 10:09:49 · 81 阅读 · 0 评论 -
uni-app调用java代码(uniapp混合开发集成原生插件aar)
最近在研究uniapp,领导有个需求。要在uniapp中调用java的方法。实际上是在安卓中写java方法最后打包成aar原生插件,再将aar插件在uniapp中进行调用。点击菜单栏“运行”->“运行到手机或模拟器”->“制作自定义基座”生成自定义基座安装包。原创 2023-08-17 10:03:37 · 4027 阅读 · 2 评论 -
minio安装集成
MinIO 是一种对象存储解决方案,提供与亚马逊云科技 S3 兼容的 API,并支持所有核心 S3 功能。MinIO 专为部署在任何地方而构建 - 公共云或私有云、裸机基础架构、编排环境和边缘基础架构。原创 2023-07-24 15:41:23 · 422 阅读 · 0 评论 -
css响应式布局
这里写自定义目录标题1.效果展示2.使用grid布局3.使用flex布局1.效果展示2.使用grid布局<!DOCTYPE html><html><head> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> <meta charset="utf-8">原创 2023-06-13 17:41:01 · 1034 阅读 · 0 评论 -
sortable+element 实现表格行拖拽的方法示例
介绍:Sortable.js是一款轻量级的拖放排序列表的js插件引用自官方文档:No jQuery required. Supports Meteor, AngularJS, React, Polymer, Vue, Knockout and any CSS library, e.g. Bootstrap.转载 2023-05-31 16:17:29 · 551 阅读 · 0 评论 -
vue使用Howler实现音乐播放器
本文使用Howler.js进行播放。使用siriwave做的播放动画具体文档地址如下最后实现效果如下:二、封装组件播放器index.vue:进度条:slisd.vue原创 2023-04-21 10:55:21 · 1324 阅读 · 0 评论 -
onlyoffice集成实现编辑预览
ONLYOFFICE 文档开发者版ONLYOFFICE Docs 是一款功能强大的在线编辑器,适用于文本文档、电子表格、演示文稿和表格。创建复杂的文档、专业的电子表格和令人惊叹的演示文稿。支持的常用 Office 和文档格式:docx、xlsx、pptx、odt、ods、odp、doc、xls、ppt、pdf、txt、rtf、html、epub、csv。完全兼容 OOXML(Office Open XML)格式。使您的用户能够在您自己的应用程序中在浏览器中在线编辑、共享和协作处理文档。原创 2023-04-04 12:03:31 · 8178 阅读 · 7 评论 -
vue集成tui.calendar日历组件
vue集成tui.calendar日历组件原创 2023-03-29 16:55:01 · 4145 阅读 · 8 评论 -
Java实现Google第三方登录
Java实现Google第三方登录原创 2022-12-14 12:05:00 · 5318 阅读 · 1 评论 -
vue/js实现图片url转为base64
vue/js实现图片url转为base64转载 2022-12-12 11:27:45 · 2746 阅读 · 1 评论 -
vue3 使用vue-cropper图片裁剪
vue3使用vue-cropper图片裁剪原创 2022-12-06 11:09:30 · 1165 阅读 · 0 评论 -
vue 微信登录
vue 微信登录原创 2022-12-02 12:17:32 · 2728 阅读 · 0 评论 -
Quasar搭建教程初体验
Quasar搭建教程初体验原创 2022-11-25 20:59:50 · 5302 阅读 · 1 评论 -
vue服务端渲染ssr
vue服务端渲染ssr原创 2022-11-10 15:56:47 · 1651 阅读 · 0 评论 -
Vue之xlsx的使用
Vue之xlsx的使用原创 2022-10-09 10:41:37 · 9565 阅读 · 1 评论 -
vue图片压缩image-conversion
vue图片压缩image-conversion原创 2022-08-31 17:01:12 · 6780 阅读 · 1 评论 -
vue使用图像编辑器tui-image-editor
vue使用图像编辑器tui-image-editor原创 2022-08-30 10:26:01 · 6395 阅读 · 7 评论 -
vue集成stripe结算界面
vue集成stripe原创 2022-07-08 18:00:01 · 3095 阅读 · 13 评论 -
CSS 显示两行,超出部分显示省略号
css显示两行超出部分显示省略号转载 2022-07-05 09:54:48 · 2424 阅读 · 0 评论 -
css的grid布局
css的grid布局转载 2022-07-01 14:38:52 · 1049 阅读 · 0 评论 -
vue元素监听(element-resize-detector 元素监听)
vue元素监听(element-resize-detector 元素监听)转载 2022-06-30 10:12:26 · 1476 阅读 · 0 评论 -
vite 中动态引入图片路径
vite 中动态引入图片路径vite 官方默认的配置,打包后会把图片名加上 hash值,但是直接通过 :src="imgSrc"方式引入并不会在打包的时候解析,导致开发环境可以正常引入,打包后却不能显示的问题,示例如下:原文地址https://www.jianshu.com/p/038adc6c8ffd打包后路径:<img src="static/icon/123.jpg">实际打包后的图片路径:static/icon/123.hash.jpg可以尝试以下方法解决:HTM转载 2022-05-18 05:10:37 · 3971 阅读 · 0 评论 -
vue项目实现文件下载中心:下载、取消下载、列表展示
vue项目实现文件下载中心:下载、取消下载、列表展示实现下载进度条封装JS方法使用store存储文件下载进度列表创建一个列表组件在页面中使用效果展示实现下载进度条平时业务中下载文件方式常见的有俩种:第一种,直接访问服务器的文件地址,自动下载文件;第二种 ,服务器返回blob文件流,再对文件流进行处理和下载。第一种自行百度第二种方式有弊端,在文件流传输过程中,用户无法感知文件流的传输状态(进度),会造成一些困扰(无法确定当前下载操作是否已经生效)。针对这种情况,我们可以在页面显示文件流的状态和传输原创 2022-04-26 16:00:26 · 3356 阅读 · 6 评论 -
vue使用tinymce富文本编辑器
vue使用tinymce富文本编辑器原创 2022-02-21 14:58:02 · 2229 阅读 · 2 评论 -
vue国家区号下拉组件 vue-country-code-selector
vue国家区号下拉组件 vue-country-code-selector地址npm安装使用地址https://github.com/CherryLeee/vue-country-code-selectornpm安装使用安装npm install vue-country-code-selector使用<template> <div class="tel-container"> <country-code-selector :countryCode.s原创 2022-01-07 17:00:19 · 5446 阅读 · 5 评论 -
vite中加载使用svg
vite中加载使用svg使用vite-plugin-svg-icons插件安装 (yarn or npm)添加配置创建svg组件全局导入页面中使用使用vite-plugin-svg-icons插件安装 (yarn or npm)yarn add vite-plugin-svg-icons -Dornpm i vite-plugin-svg-icons -D添加配置在vite.config.js中配置插件在这里插入代码片import viteSvgIcons from 'vite-plugi原创 2021-12-27 10:44:28 · 7563 阅读 · 0 评论 -
Vite+vue3+Element-plus+Route+Vuex+Axios项目搭建
Vite+vue3+Element-plus+Route+Vuex项目搭建官网搭建Vite项目启动项目安装Element安装Vue-Router安装Vuex安装vue-i18n国际化插件安装axios官网名称地址vitehttps://vitejs.cn/Elementhttps://element-plus.gitee.io/zh-CN/Vue-Routerhttps://router.vuejs.org/zh/Vuexhttps://vuex.vuejs原创 2021-12-23 19:52:32 · 1624 阅读 · 2 评论 -
纯 CSS 实现绘制各种三角形(各种角度)
https://www.cnblogs.com/chengxs/p/11406278.html转载 2021-07-02 17:33:24 · 166 阅读 · 0 评论 -
Vue实现复制功能
Vue实现复制功能原创 2021-07-01 11:16:49 · 155 阅读 · 0 评论 -
bootstrap 时间日期日历控件(datetimepicker)
效果图本文转载。原文链接请点击<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> <link href="https://cdn.bootcss.com/bootstrap-dat转载 2021-04-28 17:55:54 · 1009 阅读 · 0 评论 -
好用的日历、日程插件-fullcalendar
好用的日历、日程插件-fullcalendar官网使用标签初始化使用ES6构建系统进行初始化官网https://fullcalendar.io/使用标签初始化首先,通过fullcalendar以下方式之一获取标准捆绑包:下载:fullcalendar-5.6.0.zipCDN: jsdelivrNPM: npm install fullcalendar(可以直接下载fullcalendar-5.6.0.zip代码里面有demo可以进行参考)然后,编写以下初始化代码:<!DOCTY原创 2021-04-13 11:41:14 · 1390 阅读 · 0 评论 -
linux安装nodejs和yarn
从官网中下载nodejs官网 https://nodejs.org/建议去国内的Node.js中文网,访问比较快些Node.js中文网 http://nodejs.cn/复制拿到链接,下载nodejs(或者选择自己需要的版本,这里我想用 node.js v10.15这个版本)wget https://nodejs.org/dist/v10.15.3/node-v10.15.3-linux-x64.tar.xz解压tar -xvf node-v10.15.3-linux-x64.tar.xz原创 2021-03-12 12:12:37 · 841 阅读 · 1 评论 -
js时间戳转时间
console.log(data.order.create_time, "转换前"); function getLocalTime(nS) { return new Date(parseInt(nS) * 1000) .toLocaleString() .replace(/:\d{1,2}$/, " "); } console.log(getLocalTime(data.order.create_time), "转换后").转载 2021-01-08 12:03:17 · 60 阅读 · 0 评论 -
vue页面传参、vue两个页面相互传递参数跳转、vue跳转传参
https://blog.csdn.net/qq_39109182/article/details/80944058转载 2020-11-05 10:21:12 · 1227 阅读 · 0 评论 -
element-ui 中el-select 嵌套 tree树形控件
element-ui 中el-select 嵌套 tree树形控件用select,嵌套tree控件js部分**本文转载https://blog.csdn.net/weixin_45140661/article/details/90898558**用select,嵌套tree控件<el-select v-model="mineStatus" placeholder="请选择" multiple collapse-tags @change="selectChange"> &转载 2020-10-29 13:21:13 · 2342 阅读 · 0 评论 -
vue使用百度UEditor
vue使用百度UEditor下载UEditor导入,打包安装vue-ueditor-wrap修改ueditor配置使用UEditor下载UEditorueditor官网https://ueditor.baidu.com/website/点击下载UEditor源码需要将源码进行编译之后才能够使用或者直接下载已经编译过的。导入,打包将下载的UEditor导入到webStorm中或者其他工具。在终端执行 grunt default 进行打包如果没有安装 grunt运行npm install原创 2020-10-28 17:06:55 · 628 阅读 · 0 评论