- 作为由华人程序员尤雨溪开发的前端构架,它的出身就给国人带来了巨大的荣耀。更为重要的是Vue相对于其他前端框架更加易于上手,而且还可以与第三方库或者既有项目整合,同时还可以为单页应用提供驱动。 今天就整理几款vue开发的轮播图组件,基本不掺杂多余文件,集成项目也比较简单。 1.这款功能相对比较简单,效果中规中矩 2.这款效... 作为由华人程序员尤雨溪开发的前端构架,它的出身就给国人带来了巨大的荣耀。更为重要的是Vue相对于其他前端框架更加易于上手,而且还可以与第三方库或者既有项目整合,同时还可以为单页应用提供驱动。 今天就整理几款vue开发的轮播图组件,基本不掺杂多余文件,集成项目也比较简单。 1.这款功能相对比较简单,效果中规中矩 2.这款效...
- mock是一个模拟数据生成器,旨在帮助前端独立于后端进行开发。使前端不用去调用后端的接口,即可完成前端单元测试。 当一个项目开始开发,正常情况是前后台开发同时进行,但是很多情况是后台先提供接口,然后前端才开始编写页面,这样就会导致项目进度缓慢,为了解决这个问题,前端一般是根据接口先在本地进行数据模拟请求,本次我们使用M... mock是一个模拟数据生成器,旨在帮助前端独立于后端进行开发。使前端不用去调用后端的接口,即可完成前端单元测试。 当一个项目开始开发,正常情况是前后台开发同时进行,但是很多情况是后台先提供接口,然后前端才开始编写页面,这样就会导致项目进度缓慢,为了解决这个问题,前端一般是根据接口先在本地进行数据模拟请求,本次我们使用M...
- 前面讲了Vue2项目中动态添加路由及生成菜单,今天尝试在Vue3中动态添加路由及生成菜单。 最近在尝试用Vue3开发个管理平台项目,一切都是从头开始,基本框架搭建,熟悉Vue3写法,编写登录页,编写路由守卫,上面功能已基本完成,开始编写首页布局,用Vue3就必须用Router4.x版本,所以之前的代码迁移过来之后发现,... 前面讲了Vue2项目中动态添加路由及生成菜单,今天尝试在Vue3中动态添加路由及生成菜单。 最近在尝试用Vue3开发个管理平台项目,一切都是从头开始,基本框架搭建,熟悉Vue3写法,编写登录页,编写路由守卫,上面功能已基本完成,开始编写首页布局,用Vue3就必须用Router4.x版本,所以之前的代码迁移过来之后发现,...
- 本教程讲解的是基于Vue3和Ant Design Vue,前面讲了Vue3项目动态引入iconfont(阿里巴巴矢量图标库),这种这种写法只适用部分情况,现在我们又有了一个新的需求,就是在菜单里面使用iconfont图标,Ant Design Vue在 1.2.0 之后,使用了 SVG 图标替换了原先的 font 图标,之前... 本教程讲解的是基于Vue3和Ant Design Vue,前面讲了Vue3项目动态引入iconfont(阿里巴巴矢量图标库),这种这种写法只适用部分情况,现在我们又有了一个新的需求,就是在菜单里面使用iconfont图标,Ant Design Vue在 1.2.0 之后,使用了 SVG 图标替换了原先的 font 图标,之前...
- 相信前端开发或者后端开发都用过jquery,因为不是数据驱动,为了获取某些元素的value值,都操作过Dom元素。 // 使用Jquery获取Dom元素值$("#id").text('xxx') $("#id").value('xxx') // 使用原生D... 相信前端开发或者后端开发都用过jquery,因为不是数据驱动,为了获取某些元素的value值,都操作过Dom元素。 // 使用Jquery获取Dom元素值$("#id").text('xxx') $("#id").value('xxx') // 使用原生D...
- 组件是 vue.js最强大的功能之一,而组件实例的作用域是相互独立的,这就意味着不同组件之间的数据无法相互引用。一般来说,组件可以有以下几种关系,父子关系、兄弟关系和隔代关系,简化点可以分为父子关系和非父子关系,下面就讲讲vue父子组件通信以及非父子组件通信的方法。使用代码格式会比较乱,所以直接使用图片演示。 1.父子组件 (... 组件是 vue.js最强大的功能之一,而组件实例的作用域是相互独立的,这就意味着不同组件之间的数据无法相互引用。一般来说,组件可以有以下几种关系,父子关系、兄弟关系和隔代关系,简化点可以分为父子关系和非父子关系,下面就讲讲vue父子组件通信以及非父子组件通信的方法。使用代码格式会比较乱,所以直接使用图片演示。 1.父子组件 (...
- 上一篇已经对Vue2和Vue3的组件开发区别讲了一部分,如需了解请移步: 带你体验Vue2和Vue3开发组件的区别(一), 主要讲了template、data、methods、Lifecyle Hooks这几个的区别,接下来我们再讲讲另外几个属性的变化。 1.Computed Properties Computed Pro... 上一篇已经对Vue2和Vue3的组件开发区别讲了一部分,如需了解请移步: 带你体验Vue2和Vue3开发组件的区别(一), 主要讲了template、data、methods、Lifecyle Hooks这几个的区别,接下来我们再讲讲另外几个属性的变化。 1.Computed Properties Computed Pro...
- Vue项目开发中,有这么两个属性比较容易混淆,如果不特别注意,用法比较相似,这两个属性就是computed和watch,其实这两个还是有很大差别,下面就讲讲这两个属性的用法及不同 先说说为什么比较像,我们看下面代码。 <template> <div>  ... Vue项目开发中,有这么两个属性比较容易混淆,如果不特别注意,用法比较相似,这两个属性就是computed和watch,其实这两个还是有很大差别,下面就讲讲这两个属性的用法及不同 先说说为什么比较像,我们看下面代码。 <template> <div>  ...
- Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中。本文重点介绍在Vue项目中简单封装Axios Vue推荐我们使用Axios,vue-resource在Vue2.0后就不再更新,本文对Axios的用法不做过多的介绍,只是在项目上简单封装及使用,如果有需要了解的,可以访问gi... Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中。本文重点介绍在Vue项目中简单封装Axios Vue推荐我们使用Axios,vue-resource在Vue2.0后就不再更新,本文对Axios的用法不做过多的介绍,只是在项目上简单封装及使用,如果有需要了解的,可以访问gi...
- 1 Options API Options API 可以翻译为选项API,字面意思可供使用者挑拣的分类条目,就是框架定义好选项,我们可以把我们的功能写在选项里,如props 里面设置接收参数、data 里面设置变量、computed 里面设置计算属性、watch 里面设置监听属性、methods 里面设置事件方法你会发现 Opt... 1 Options API Options API 可以翻译为选项API,字面意思可供使用者挑拣的分类条目,就是框架定义好选项,我们可以把我们的功能写在选项里,如props 里面设置接收参数、data 里面设置变量、computed 里面设置计算属性、watch 里面设置监听属性、methods 里面设置事件方法你会发现 Opt...
- 最近一直在更新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全家桶,对新手来说,是个不错的上...
上滑加载中
推荐直播
-
华为云码道-玩转OpenClaw,在线养虾2026/03/11 周三 19:00-21:00
刘昱,华为云高级工程师/谈心,华为云技术专家/李海仑,上海圭卓智能科技有限公司CEO
OpenClaw 火爆开发者圈,华为云码道最新推出 Skill ——开发者只需输入一句口令,即可部署一个功能完整的「小龙虾」智能体。直播带你玩转华为云码道,玩转OpenClaw
回顾中 -
华为云码道-AI时代应用开发利器2026/03/18 周三 19:00-20:00
童得力,华为云开发者生态运营总监/姚圣伟,华为云HCDE开发者专家
本次直播由华为专家带你实战应用开发,看华为云码道(CodeArts)代码智能体如何在AI时代让你的创意应用快速落地。更有华为云HCDE开发者专家带你用码道玩转JiuwenClaw,让小艺成为你的AI助理。
回顾中 -
Skill 构建 × 智能创作:基于华为云码道的 AI 内容生产提效方案2026/03/25 周三 19:00-20:00
余伟,华为云软件研发工程师/万邵业(万少),华为云HCDE开发者专家
本次直播带来两大实战:华为云码道 Skill-Creator 手把手搭建专属知识库 Skill;如何用码道提效 OpenClaw 小说文本,打造从大纲到成稿的 AI 原创小说全链路。技术干货 + OPC创作思路,一次讲透!
回顾中
热门标签