- 最近一直在更新Vue项目中配置及使用一些内置的方法,今天讲一讲Vue项目中使用iconfont图标库,不管是管理平台还是官网展示之类的显示页面,都会用到一些小图标,如果我们用img标签,那我们的资源库会非常的大,而且后期如果我们针对图标调整大小,改色等之类的操作,就需要用到Photoshop等专业类工具,上手困难不说,而且比较麻烦... 最近一直在更新Vue项目中配置及使用一些内置的方法,今天讲一讲Vue项目中使用iconfont图标库,不管是管理平台还是官网展示之类的显示页面,都会用到一些小图标,如果我们用img标签,那我们的资源库会非常的大,而且后期如果我们针对图标调整大小,改色等之类的操作,就需要用到Photoshop等专业类工具,上手困难不说,而且比较麻烦...
- Vite — 一个Vue作者开发的Web开发工具,它具有快速的冷启动、及时的模块热更新、真正的按需加载。 Vite基于浏览器原生 ES imports 的开发服务器。利用浏览器去解析 imports,在服务器端按需编译返回,完全跳过了打包这个概念,服务器随起随用。既然这么好,那就赶紧体验下。 1.创建并运行Vue +... Vite — 一个Vue作者开发的Web开发工具,它具有快速的冷启动、及时的模块热更新、真正的按需加载。 Vite基于浏览器原生 ES imports 的开发服务器。利用浏览器去解析 imports,在服务器端按需编译返回,完全跳过了打包这个概念,服务器随起随用。既然这么好,那就赶紧体验下。 1.创建并运行Vue +...
- 在Vue项目上,有时需要对页面元素进行展示和隐藏,Vue框架就提供了条件渲染的指令v-show和v-if。 那这两个有什么区别呢,我们先看下官方v-show和v-if的对比解释: 官方解释 v-if 是“真正”的条件渲染,因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。 v-if 也是惰性的:如果在... 在Vue项目上,有时需要对页面元素进行展示和隐藏,Vue框架就提供了条件渲染的指令v-show和v-if。 那这两个有什么区别呢,我们先看下官方v-show和v-if的对比解释: 官方解释 v-if 是“真正”的条件渲染,因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。 v-if 也是惰性的:如果在...
- watch的作用可以监控一个值的变换,并调用因为变化需要执行的方法。可以通过watch动态改变关联的状态。 简单来说就是,vue是数据双向绑定,当页面数据发生变化时,我们通过watch可以拿到变化前和变化后的值,之后做一系列操作,下面我们通过例子来解释。 1.监听单个值变化 <template>&nbs... watch的作用可以监控一个值的变换,并调用因为变化需要执行的方法。可以通过watch动态改变关联的状态。 简单来说就是,vue是数据双向绑定,当页面数据发生变化时,我们通过watch可以拿到变化前和变化后的值,之后做一系列操作,下面我们通过例子来解释。 1.监听单个值变化 <template>&nbs...
- 今天分享的源码是我很早之前gitee上开源的一个管理后台模版,是基于vue和elementUI的一个基础版,技术栈使用:vue2 + vuex + vue-router + webpack + ES6/7 + axios + elementUI + 阿里图标iconfont,可以说基本上使用了vue全家桶,对新手来说,是个不错的上... 今天分享的源码是我很早之前gitee上开源的一个管理后台模版,是基于vue和elementUI的一个基础版,技术栈使用:vue2 + vuex + vue-router + webpack + ES6/7 + axios + elementUI + 阿里图标iconfont,可以说基本上使用了vue全家桶,对新手来说,是个不错的上...
- WebSocket 协议自2008年诞生2011年成为国际标准以来。目前所有浏览器都已经支持了。因此我们不需要担心在项目中使用是否会有其他问题,WebSocket实现了浏览器与服务器全双工通信,服务器可以主动向客户端推送信息,客户端也可以主动向服务器发送信息。 MDN上面有详细的文档,这里就不过多介绍,我们直接在vue项目上使用W... WebSocket 协议自2008年诞生2011年成为国际标准以来。目前所有浏览器都已经支持了。因此我们不需要担心在项目中使用是否会有其他问题,WebSocket实现了浏览器与服务器全双工通信,服务器可以主动向客户端推送信息,客户端也可以主动向服务器发送信息。 MDN上面有详细的文档,这里就不过多介绍,我们直接在vue项目上使用W...
- 使用脚手架搭建的Vue3项目默认使用的路由版本是4,由于Vue3和Vue2写法差异较大,所以需要从新熟悉Router用法,本篇文章比较下两个版本的写法差异,不做深层次的讲解,主要是我也不懂。 1 Vue2配合Vue-router3 说多了没用,直接上代码 import Vue from ... 使用脚手架搭建的Vue3项目默认使用的路由版本是4,由于Vue3和Vue2写法差异较大,所以需要从新熟悉Router用法,本篇文章比较下两个版本的写法差异,不做深层次的讲解,主要是我也不懂。 1 Vue2配合Vue-router3 说多了没用,直接上代码 import Vue from ...
- 前面已经讲了浅谈Vue2中provide和inject使用,今天讲讲在Vue3中如何使用provide和inject Vue3的写法已经和Vue2有所不同,因此需要熟悉Vue3的写法,其实变动不大,现在官方文档也有详细介绍,有兴趣的可以去了解. 1 使用 Provide 在 setup() 中使用 pro... 前面已经讲了浅谈Vue2中provide和inject使用,今天讲讲在Vue3中如何使用provide和inject Vue3的写法已经和Vue2有所不同,因此需要熟悉Vue3的写法,其实变动不大,现在官方文档也有详细介绍,有兴趣的可以去了解. 1 使用 Provide 在 setup() 中使用 pro...
- 项目基于Vue-cli3.x进行开发,使用了ant-design-vue框架,然后需要做国际化。此时做国际化需要考虑两方面的国际化,一是ant-design-vue内部组件的国际化,二是国际化我们的业务显示,业务显示我们选用vue-i18n进行国际化。 安装vue-i18n yarn add vue-i18n 在public... 项目基于Vue-cli3.x进行开发,使用了ant-design-vue框架,然后需要做国际化。此时做国际化需要考虑两方面的国际化,一是ant-design-vue内部组件的国际化,二是国际化我们的业务显示,业务显示我们选用vue-i18n进行国际化。 安装vue-i18n yarn add vue-i18n 在public...
- 点击上方“ 青年码农 ”关注 回复“特效源码”可获取各种资料 前面讲了关于vue组件间数据传递,如果没有看过,关注公众号,有历史推荐,讲的比较详细,有代码,新手也能看懂,今天说一说$attrs和$listener。 疫情之前,在家关了这么久,也没怎么更新,最近在看大佬的项目,学习下新的思路。之前项目上,父子组件传递数据,都是用pr... 点击上方“ 青年码农 ”关注 回复“特效源码”可获取各种资料 前面讲了关于vue组件间数据传递,如果没有看过,关注公众号,有历史推荐,讲的比较详细,有代码,新手也能看懂,今天说一说$attrs和$listener。 疫情之前,在家关了这么久,也没怎么更新,最近在看大佬的项目,学习下新的思路。之前项目上,父子组件传递数据,都是用pr...
- 前段时间电脑重新装机,导致之前安装的环境全部需要重新安装,加上最近要写个移动端H5项目,思来想去,还是用vue脚手架搭建吧 没有安装,那就安装下 npm install -g @vue/cli 装的版本比较高,创建项目就需要init了 vue create my-pro... 前段时间电脑重新装机,导致之前安装的环境全部需要重新安装,加上最近要写个移动端H5项目,思来想去,还是用vue脚手架搭建吧 没有安装,那就安装下 npm install -g @vue/cli 装的版本比较高,创建项目就需要init了 vue create my-pro...
- 混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被“混合”进入该组件本身的选项。 这句话我们可以理解为在js代码中定义一个混入对象,里面可以包含一个组件可以有的任何组件选项:data、method、watch... 混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被“混合”进入该组件本身的选项。 这句话我们可以理解为在js代码中定义一个混入对象,里面可以包含一个组件可以有的任何组件选项:data、method、watch...
- Vue.js 允许你自定义过滤器,可被用于一些常见的文本格式化。过滤器可以用在两个地方:双花括号插值和 v-bind 表达式 (后者从 2.1.0+ 开始支持)。过滤器应该被添加在 JavaScript 表达式的尾部,由“管道”符号指示: <!-- 在双花括号中 -->{{ m... Vue.js 允许你自定义过滤器,可被用于一些常见的文本格式化。过滤器可以用在两个地方:双花括号插值和 v-bind 表达式 (后者从 2.1.0+ 开始支持)。过滤器应该被添加在 JavaScript 表达式的尾部,由“管道”符号指示: <!-- 在双花括号中 -->{{ m...
- 写管理后台的都会遇到这个这种需求,管理员登录后台需要看到所有功能,普通的公司管理员或部门管理员登录只能看到部分功能权限 不同角色有不同的权限,这时如果管理平台的菜单定义在代码里,显然是不能满足上面的需求,我们就需要后台提供用户菜单,然后前台动态生成路由。 1 动态添加路由 利用 vue-router 的 addRo... 写管理后台的都会遇到这个这种需求,管理员登录后台需要看到所有功能,普通的公司管理员或部门管理员登录只能看到部分功能权限 不同角色有不同的权限,这时如果管理平台的菜单定义在代码里,显然是不能满足上面的需求,我们就需要后台提供用户菜单,然后前台动态生成路由。 1 动态添加路由 利用 vue-router 的 addRo...
- 文章目录 1. 效果展示2. 两套用户体系3. 创建用户表4. 配置系统登录5. 修改流程图6. 提交请假申请6.1 页面设计6.2 后台处理 7. 历史请假列表8. 待审批列表9. 测试 ... 文章目录 1. 效果展示2. 两套用户体系3. 创建用户表4. 配置系统登录5. 修改流程图6. 提交请假申请6.1 页面设计6.2 后台处理 7. 历史请假列表8. 待审批列表9. 测试 ...
上滑加载中
推荐直播
-
华为云码道 × 仓颉编程:工程化AI编码探索2026/05/27 周三 19:00-21:00
刘俊杰-华为云仓颉语言专家/李炎-华为云码道技术专家/王智鹏-OpenCangjie开源社区发起人
本场直播围绕华为云仓颉语言与华为云码道的深度结合,展示华为云智能编程从零基础到高效落地的完整生态能力。以华为云码道为引擎,仓颉语言为载体,带给大家日常提效、趣味创新到极速量产的开发体验。
回顾中 -
一个AI团队帮你写代码:华为云码道Agent Space实战2026/06/25 周四 19:00-21:00
张翰文-华为云码道工程师/郭英旭-青软创新科技集团股份有限公司 软件架构师
本场直播聚焦华为云码道Agent Space两大模式:研发办公、代码开发,亲身体验从需求到代码的AI自动化能力。实操演示基于华为 CodeArts CLI,依托 OpenSpec 规格体系从零搭建业务项目。
回顾中
热门标签