lottie 动画在 vue 中的使用
前言 最近我所负责的项目中采用了动画效果，最早使用 gif 来实现。然而，在实践过程中，我发现 gif 格式的动画在 git 中出现了明显的锯齿感，这让我非常困扰。为了追求更完美的表现效果，我最终选择了 lottie 来实现我的动画需求。我深知动画效果的呈现对于用户体验至关重要，因此我非常认真地对待每一个细节，希望通过我的努力，为用户带来更加流畅、自然的视觉体验。 Lottie 简介 Lottie 是一个适用于 Android、iOS、...
全兼容的毛玻璃效果
通过本文，你能了解到： 1. 最基本的使用 CSS 实现磨砂玻璃(毛玻璃)的效果。 2. 在至今不兼容 的 firefox 浏览器，如何利用一些技巧性的操作，巧妙的同样实现毛玻璃效果，让这个效果真正能运用在业务当中。 什么是 CSS 属性可以让你为一个元素后面区域添加图形效果（如模糊或颜色偏移）。 因为它适用于元素背后的所有元素，为了看到效果，必须使元素或其背景至少部分透明。 与 非常类似，可以取的值都是一样的，但是一个是作用于整个元素...
实现同时上传文件和表单json数据的解决方案 - 掘金
项目需求，实现通过一个后端接口同时接收form表单数据和文件。 前端 后端 1. 选择多个文件一起上传 错误代码 浏览器network调试面板中可看到发送的files参数为\[object file\]形式，而正确的形式应该是\[binary\] 解决方案 2. formData方法append和set区别 通过append(key, value)来添加数据 如果指定的key不存在则会新增一条数据，如果key存在，则添加到数据的末尾 通...
重新认识 Vue
使用 Vue3 的多种方式 Standalone Script：独立脚本 Embedded Web Components：作为 Web Component 嵌入 Single Page Application (SPA)：单页面应用 Fullstack / SSR：全栈/服务端渲染 JAMStack / SSG：JAMStack 架构/静态站点生成 独立脚本 首先，我们创建一个 html 文件。 其次，既然我们需要创建 Vue 项目，那...
Drag & Drop • by FormKit拖拽
Getting Started Install Drag and Drop is published as on npm. Click to copy the install command for your package manager of choice: Usage Drag and drop ships two main functions: and . These can be imported for your frame...
Vue3 新项目，没必要再用 Pinia 了
上线！欢迎领取～ 大家好，我是杨成功！ 最近弄了一个新的 Vue3 项目，页面不多，其中有三四个页面需要共享状态，我几乎条件反射般地安装了 来做状态管理。 后来一想，我只需要一个仓库，存放几个状态而已，有必要单独接一套 Pinia 吗？ 其实不需要，我差点忘记了 Vue3 的一个重要特性，那就是 。 组合式 API 大家都知道，组合式函数可能大家没有特别留意。但是它功能强大，足矣实现全局状态管理。 组合式函数 什么是组合式函数？以下是官...
Vue3.4 中组件 v-model 双向数据绑定
哈喽,大家好 我是 👨🏻💻。今天给大家推荐一个 Vue3.4 中新增的 这个 , 真的超好用！！！ 前言 随着 版本的发布， 也正式转正了。它可以简化父子组件之间的 ，是目前官方推荐的双向绑定实现方式。 之前在 Vue3.3 中，该方法还是 方法，使用 defineModel 需在 里面配置 为 ，配置如下： 但 版本中已经是稳定特性了！！！ 正式介绍 defineModel defineModel 是一个新的 宏，旨在简化支持...
vue3同时引入多个iconfont图标库
vue3同时引入多个iconfont图标库 下载iconfont库 创建项目库 iconfont官网：https://www.iconfont.cn/ 选择图标，加入 图标加入项目库 打开购物车，选择【添加至项目】 下载到本地 首页选择【资源管理】–【我的项目】，进入【我的项目】 选择要下载的项目，点击【下载至本地】 【解压】后查看文件结构 vue3引入 文件存放位置 在 目录下新建 目录 在浏览器打开 ，可以所有的图标样...
vue中点击事件click加括号和不加括号的区别
官方说法： 在Vue中，使用@click指令来监听元素的点击事件，并执行相应的方法。区分不同的点击事件可以通过传递不同的方法名或方法名后面添加一对小括号来实现。 区别： 1\. @click="comfors"：这是一个简单的绑定事件语法，当元素被点击时，会调用comfors方法。 2\. @click="comfors()"：这是在点击事件上调用方法的语法，当元素被点击时，会立即执行comfors方法。 3.@click="comfo...