《Vue3笔记》第12节：Vue3项目采用SVG方式引入图标文件

Mr.小朱同学 2025-01-02 20:35:18

2024已成过往，2025新的开始，继续加油吧，今年争取多学点东西✌，正在学习前端，更新专栏中~~

《Vue3项目开发 | 从零到一》记录学习Vue3项目开发的笔记内容，从搭建Vue3基础开发环境，再到如何引入各种开发插件，实现各种常见的前端功能。每一篇文章都附有单独的源代码仓库地址，方便用户查看案例代码。

《Vue3笔记》第12节：Vue3项目采用SVG方式引入图标文件

https://blog.csdn.net/qq_39826207/article/details/144804167?spm=1001.2014.3001.5501

...全文
2025 新年快乐
拼手气红包 26.23元
9583 回复 打赏 收藏 转发到动态 举报
AI 作业
写回复
用AI写文章
回复
切换为时间正序
请发表友善的回复…
发表回复
vue使用svg文件补充-svg放大缩小操作(使用d3.js)
前言 项目需求是要引入svg文件，然后对里面的元素进行赋值，完了之后还要能够让svg放大缩小，点击查看全屏。针对上一篇文章，进行对svg文件里面的元素进行赋值和放大缩小的补充笔记 svg元素赋值 1. 先看看svg文件的代码 思路：我的想法就是循环拿到里面的id，然后跟后台的数据匹配，然后赋值。因为后台返回的数据id是没有后面的_C和_V 的。所以需要我前端的处理。 2. 前端js代码： onWinResize(item) { // item是后台返回的数据，我数据处理函数是单独写的，没有放在接口请求后面 var svg = document.getElementById('
基于Vue3+TypeScript的在线寻医问诊平台设计源码
该项目是一款基于Vue3、TypeScript、VantPinia、SCSS、Vue-Router、Axios及socket.io构建的在线寻医问诊平台源码，共包含127个文件，其中SVG文件43个、Vue组件文件35个、TypeScript文件24个、JSON配置文件7个、PNG图片文件5个、SCSS样式文件2个，以及开发与生产环境配置文件各1个。平台提供医生搜索、快速问诊、开药门诊、疾病查询和健康百科等服务，旨在为用户提供便捷的问诊和医疗服务选择。
基于Vue3的2021级3班前端技能提升笔记设计源码
本项目是一款基于Vue3框架开发的2021级3班前端技能提升笔记设计源码，包含285个文件，其中Vue组件96个、JavaScript脚本50个、HTML文档42个、JSON数据34个、CSS样式16个、Markdown文档11个、SVG图形11个、Git忽略文件10个、ICO图标9个、ZIP压缩文件2个。本设计集成了前端开发必备技能，学习后可助力薪资提升，预期工资增值10086元。
3D旋转+SVG路径动画特效.rar
非常实用的特效代码，可以完美运行，可以二次修改！
2018年最新vue2.5 硅谷外卖视频
百度云盘链接 项目描述: 01_vue项目_项目功能演示.avi 02_Vue项目_项目开发准备.avi 03_Vue项目_创建项目并运行.avi 04_Vue项目_资源准备.avi 05_Vue项目_项目源码目录设计.avi 06_Vue项目_stylus使用.avi 07_Vue项目_组件化编码.avi 08_Vue项目_引入vue-router.avi 09_Vue项目_FooterGuide组件.avi 10_Vue项目_各导航路由组件(静态).avi 11_Vue项目_HeaderTop组件.avi 12_Vue项目_使用swiper实现商品分类列表轮播.avi 13_Vue项目_ShopList组件(静态).avi 14_Vue项目_Login组件(静态).avi 15_Vue项目_启动后台应用并测试接口.avi 16_Vue项目_封装ajax请求函数.avi 17_Vue项目_封装接口请求函数.avi 18_Vue项目_使用git对项目进行版本控制.avi 19_Vue项目_复习.avi 20_Vue项目_配置代理实现跨域ajax请求.avi 21_Vue项目_创建vuex的整体结构.avi 22_Vue项目_使用vuex管理首页数据.avi 23_Vue项目_异步显示当前地地址.avi 24_Vue项目_异步显示食品分类轮播列表.avi 25_Vue项目_使用watch和$nextTick解决轮播的bug.avi 26_Vue项目_异步显示商家列表.avi 27_Vue项目_使用svg显示加载中提示界面.avi 28_Vue项目_Star组件.avi 29_Vue项目_注册登陆功能演示说明.avi 30_Vue项目_登陆界面效果1_切换登陆方式.avi 31_Vue项目_登陆界面效果2_手机号检查.avi 32_Vue项目_登陆界面效果3_倒计时效果.avi 33_Vue项目_登陆界面效果4_切换密码的显示和隐藏.avi 34_Vue项目_登陆界面效果5_前台表达验证.avi 35_Vue项目_复习.avi 36_Vue项目_动态一次性图形验证码.avi 37_Vue项目_定义接口请求函数.avi 38_Vue项目_登陆_发送短信验证码.avi 39_Vue项目_登陆_完成登陆请求.avi 40_Vue项目_登陆_保存用户信息到vuex.avi 41_Vue项目_登陆后更新个人中心界面.avi 42_Vue项目_登陆更新跳转路由.avi 43_Vue项目_自动登陆.avi 44_Vue项目_退出登陆.avi 45_Vue项目_搭建商家整体界面.avi 46_Vue项目_json的理解.avi 47_Vue项目_设计json数据.avi 48_Vue项目_使用mockjs模拟接口数据.avi 49_Vue项目_ajax请求mockjs模拟的接口.avi 50_Vue项目_ShopHeader组件.avi 51_Vue项目_复习.avi 52_Vue项目_异步显示goods数据.avi 53_Vue项目_滑动效果分析.avi 54_Vue项目_使用better-scroll实现回弹滑动.avi 55_Vue项目_收集scrollY.avi 56_Vue项目_收集tops.avi 57_Vue项目_滑动右侧列表更新当前分类.avi 58_Vue项目_解决惯性滑动不更新当前分类的bug.avi 59_Vue项目_点击分类项滑动右侧列表.avi 60_Vue项目_CartControl组件1.avi 61_Vue项目_CartControl组件2.avi 62_Vue项目_Food组件1.avi 63_Vue项目_Food组件2.avi 64_Vue项目_ShopCart组件1.avi 65_Vue项目_ShopCart组件2.avi 66_Vue项目_显示购物项列表.avi 67_Vue项目_解决列表显示的3个bug.avi 68_Vue项目_复习.avi 69_Vue项目_购物车动画.avi 70_Vue项目_购物车列表的滑动.avi 71_Vue项目_清空购物车.avi 72_Vue项目_ShopRatings组件1.avi 73_Vue项目_ShopRatings组件2.avi 74_Vue项目_ShopInfo组件1.avi 75_Vue项目_ShopInfo组件2.avi 76_Vue项目_ShopInfo组件3.avi 77_Vue项目_Search组件.avi 78_Vue项目_缓存路由组件对象.avi 79_Vue项目_路由组件懒加载.avi 80_Vue项目_图片懒加载vue-lazyload.avi 81_Vue项目_使用moment实现日期过滤器.avi 82_Vue项目_打包文件分析与优化.avi 笔记总结.zip 课件资料.zip
Mr.小朱同学

563

社区成员

27

社区内容

发帖
与我相关
我的任务
社区描述
个人社区，记录一些学习笔记、日常工作内容。
AIGCjava前端 个人社区
社区管理员
  • Mr.小朱同学
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章