- 一、前言blur与change事件在绝大部分情况下表现都非常相似，输入结束后，离开输入框，会先后触发change与blur，唯有两点例外。1. 没有进行任何输入时，不会触发change。在这种情况下，输入框并不会触发change事件，但一定会触发blur事件。在判断表单修改状态时，这种差异会非常有用，通过change事件能轻易地找到哪些字段发生了变更以及其值的变更轨迹。2. 输入后值并没有... 一、前言blur与change事件在绝大部分情况下表现都非常相似，输入结束后，离开输入框，会先后触发change与blur，唯有两点例外。1. 没有进行任何输入时，不会触发change。在这种情况下，输入框并不会触发change事件，但一定会触发blur事件。在判断表单修改状态时，这种差异会非常有用，通过change事件能轻易地找到哪些字段发生了变更以及其值的变更轨迹。2. 输入后值并没有...
- 一、前言Vue.js 允许自定义过滤器，可被用于一些常见的文本格式化。过滤器可以用在两个地方：双花括号插值和 v-bind 表达式 (后者从 2.1.0+ 开始支持)。过滤器应该被添加在 JavaScript 表达式的尾部，由“管道”符号指示：<!-- 在双花括号中 -->{{ message | capitalize }}<!-- 在 `v-bind` 中 --><div v-bind:... 一、前言Vue.js 允许自定义过滤器，可被用于一些常见的文本格式化。过滤器可以用在两个地方：双花括号插值和 v-bind 表达式 (后者从 2.1.0+ 开始支持)。过滤器应该被添加在 JavaScript 表达式的尾部，由“管道”符号指示：<!-- 在双花括号中 -->{{ message | capitalize }}<!-- 在 `v-bind` 中 --><div v-bind:...
- 一、升级 Vue 3.0 项目目前创建 Vue 3.0 项目需要通过插件升级的方式来实现，vue-cli 暂时还未直接支持创建Vue3.0项目，首先我们进入项目目录，并输入以下指令：cd vue-next-testvue add vue-next 二、setupsetup() 函数是 vue3 中专门为组件提供的新属性。它为我们使用 vue3 的 Composition API 新特性提供... 一、升级 Vue 3.0 项目目前创建 Vue 3.0 项目需要通过插件升级的方式来实现，vue-cli 暂时还未直接支持创建Vue3.0项目，首先我们进入项目目录，并输入以下指令：cd vue-next-testvue add vue-next 二、setupsetup() 函数是 vue3 中专门为组件提供的新属性。它为我们使用 vue3 的 Composition API 新特性提供...
- 一、前言Vue2持续更新过程中，Vue3已经呼之欲出了，目前Vue官网已经显示Vue3在beta进度了。下面我们主要讲解下Vue3的一些新特性。 二、实践目前创建 Vue 3.0 项目需要通过插件升级的方式来实现，vue-cli 还没有直接支持，我们进入项目目录，并输入以下指令进行升级。cd vue-next-testvue add vue-next 三、不变点模板语法保持不变；不需要使用... 一、前言Vue2持续更新过程中，Vue3已经呼之欲出了，目前Vue官网已经显示Vue3在beta进度了。下面我们主要讲解下Vue3的一些新特性。 二、实践目前创建 Vue 3.0 项目需要通过插件升级的方式来实现，vue-cli 还没有直接支持，我们进入项目目录，并输入以下指令进行升级。cd vue-next-testvue add vue-next 三、不变点模板语法保持不变；不需要使用...
- 一、前言在博文《Vue进阶（九十一）：自定义指令》中讲解了Vue自定义指令（局部、全局）的创建方法，及指令相关的钩子函数。此篇博文在此基础上实现vue自定义拖动指令。 二、定义全局拖拽指令定义全局指令，需要在main.js中写入vue.directive('drag',{});即可。但是一般会先在项目中新建一个drag.js文件，在js文件内部实现拖拽逻辑，最后在dom代码中调用该指令。 ... 一、前言在博文《Vue进阶（九十一）：自定义指令》中讲解了Vue自定义指令（局部、全局）的创建方法，及指令相关的钩子函数。此篇博文在此基础上实现vue自定义拖动指令。 二、定义全局拖拽指令定义全局指令，需要在main.js中写入vue.directive('drag',{});即可。但是一般会先在项目中新建一个drag.js文件，在js文件内部实现拖拽逻辑，最后在dom代码中调用该指令。 ...
- this指向组件实例，$el用于获取Vue实例挂载的DOM元素，在mounted生命周期中才有效，之前的钩子函数内无效。如下代码所示，Vue脚手架中，$el指向当前组件template模板中的根标签。<template> <div id="root"> <h1 @click="fn()"> Lorem, ipsum </h1> </div></template><s... this指向组件实例，$el用于获取Vue实例挂载的DOM元素，在mounted生命周期中才有效，之前的钩子函数内无效。如下代码所示，Vue脚手架中，$el指向当前组件template模板中的根标签。<template> <div id="root"> <h1 @click="fn()"> Lorem, ipsum </h1> </div></template><s...
- vite+vue3+electron桌面端开发 vite+vue3+electron桌面端开发
- 一、前言<component>元素是vue 里面的内置组件。在<component>里面使用 :is，可以实现动态组件的效果。 二、示例解析下面例子创建一个包含多子组件的 vue 实例。vue代码部分：新建 vue 实例 “app”，这个实例的 components 里面，有3个组件，这些组件都有各自的模板。分别是 acomp，bcomp，ccomphtml 代码部分：使用vue 内置组件... 一、前言<component>元素是vue 里面的内置组件。在<component>里面使用 :is，可以实现动态组件的效果。 二、示例解析下面例子创建一个包含多子组件的 vue 实例。vue代码部分：新建 vue 实例 “app”，这个实例的 components 里面，有3个组件，这些组件都有各自的模板。分别是 acomp，bcomp，ccomphtml 代码部分：使用vue 内置组件...
- 一、Vue 定时器在vue中，有两种定时器，一是浏览器API，window对象上的；另一种就是vue/nodejs封装的，需要引入。import { setInterval, clearInterval } from 'timers'建议使用window对象自带的，因为不容易错。如果一不小心只引入一个，就怎么也清不掉了。import { setInterval } from 'timers... 一、Vue 定时器在vue中，有两种定时器，一是浏览器API，window对象上的；另一种就是vue/nodejs封装的，需要引入。import { setInterval, clearInterval } from 'timers'建议使用window对象自带的，因为不容易错。如果一不小心只引入一个，就怎么也清不掉了。import { setInterval } from 'timers...
- 一、前言Render 函数是 Vue2.x 新增的一个函数、主要用来提升节点渲染性能，它是基于 JavaScript 计算。使用 Render 函数将 Template 里面的节点解析成虚拟的Dom 。Vue 推荐在绝大多数情况下使用模板来创建 HTML。然而在一些场景中，你需要 JavaScript 的完全编程能力。这时你可以用渲染函数render，它比模板更接近编译器。在深入渲染函数之... 一、前言Render 函数是 Vue2.x 新增的一个函数、主要用来提升节点渲染性能，它是基于 JavaScript 计算。使用 Render 函数将 Template 里面的节点解析成虚拟的Dom 。Vue 推荐在绝大多数情况下使用模板来创建 HTML。然而在一些场景中，你需要 JavaScript 的完全编程能力。这时你可以用渲染函数render，它比模板更接近编译器。在深入渲染函数之...
- 一、拓展阅读在前端应用中，窗口间通信应用场景很多，比如弹出qq登录认证窗。 二、postMessage 语法window.postMessage(msg,targetOrigin)注意⚠️postMessage要通过window对象调用！因为这里的window不只是当前window！大部分使用postMessage的时候，都不是本页面的window，而是其他网页的window！如：ifra... 一、拓展阅读在前端应用中，窗口间通信应用场景很多，比如弹出qq登录认证窗。 二、postMessage 语法window.postMessage(msg,targetOrigin)注意⚠️postMessage要通过window对象调用！因为这里的window不只是当前window！大部分使用postMessage的时候，都不是本页面的window，而是其他网页的window！如：ifra...
- 学习VUE3总得知道Proxy怎么使用吧我们都知道vue2是使用object.defineProxy实现数据监控的，但在vue3中改成了使用JS新增的Proxy对象。今天就来看一下Proxy 是如何使用的Proxy对象用于创建一个对象的代理，进而实现基本操作的拦截和定义。它的基本语法是const p = new Proxy(target, handler)target是使用Proxy包裹的目... 学习VUE3总得知道Proxy怎么使用吧我们都知道vue2是使用object.defineProxy实现数据监控的，但在vue3中改成了使用JS新增的Proxy对象。今天就来看一下Proxy 是如何使用的Proxy对象用于创建一个对象的代理，进而实现基本操作的拦截和定义。它的基本语法是const p = new Proxy(target, handler)target是使用Proxy包裹的目...
- Vue2.X是如何利用Object.defineProperty()实现数据绑定的上一篇文章写到了Object.defineProperty的使用，这篇文章说一下Vue是如何利用这个方法实现数据绑定的。首先把Vue中的核心方法defineReactive做一些简化function defineReactive (obj, key, val, cb) { var dep = new De... Vue2.X是如何利用Object.defineProperty()实现数据绑定的上一篇文章写到了Object.defineProperty的使用，这篇文章说一下Vue是如何利用这个方法实现数据绑定的。首先把Vue中的核心方法defineReactive做一些简化function defineReactive (obj, key, val, cb) { var dep = new De...
- 学习VUE总得知道Object.defineProxy怎么使用吧工作归工作，不要觉得会用就完事了，很多时候得多看看基础。今天就专门讲一下Object.defineProxy是如何使用的，这样在以后讲到Vue2.X的源码时，就更容易理解了。Object.defineProperty()方法可以直接在一个对象上定义一个新属性或者修改它的一个先有属性并返回此对象。下面先举个例子示意下。const ... 学习VUE总得知道Object.defineProxy怎么使用吧工作归工作，不要觉得会用就完事了，很多时候得多看看基础。今天就专门讲一下Object.defineProxy是如何使用的，这样在以后讲到Vue2.X的源码时，就更容易理解了。Object.defineProperty()方法可以直接在一个对象上定义一个新属性或者修改它的一个先有属性并返回此对象。下面先举个例子示意下。const ...
- 在本篇内容中我会给大家介绍一下关于Vuex中四个map方法的使用下面我对四个方法进行一下介绍mapState方法：是用于帮助我们映射state中的数据为计算属性； mapGetters方法：用于帮助我们映射；mapActions方法：用于帮助我们生成与actions对话的方法，即：包含$store.dispatch(xxx)的函数getters中的数据为计算属性；mapMutations方法... 在本篇内容中我会给大家介绍一下关于Vuex中四个map方法的使用下面我对四个方法进行一下介绍mapState方法：是用于帮助我们映射state中的数据为计算属性； mapGetters方法：用于帮助我们映射；mapActions方法：用于帮助我们生成与actions对话的方法，即：包含$store.dispatch(xxx)的函数getters中的数据为计算属性；mapMutations方法...
上滑加载中
推荐直播
-
开发者玩转DeepSeek2025/02/20 周四 16:30-17:30
Thomas – 华为云DTSE技术布道师
双擎驱动优势——华为云CodeArts IDE全栈能力与DeepSeek认知智能深度融合，打造智能编码助手。如何利用DeepSeek的能力，进一步强化业务。
回顾中 -
探秘仓颉编程语言：华为开发者空间的创新利器2025/02/22 周六 15:00-16:30
华为云讲师团
本期直播将与您一起探秘颉编程语言上线华为开发者空间后，显著提升开发效率，在智能化开发支持、全场景跨平台适配能力、工具链与生态完备性、语言简洁与高性能特性等方面展现出的独特优势。直播看点： 1.java转仓颉的小工具 2.仓颉动画三方库lottie 3.开发者空间介绍及如何在空间用仓颉编程语言开发
即将直播 -
大模型Prompt工程深度实践2025/02/24 周一 16:00-17:30
盖伦 华为云学堂技术讲师
如何让大模型精准理解开发需求并生成可靠输出？本期直播聚焦大模型Prompt工程核心技术：理解大模型推理基础原理，关键采样参数定义，提示词撰写关键策略及Prompt工程技巧分享。
去报名
热门标签