zl程序教程

您现在的位置是:首页 >  前端

当前栏目

vue学习笔记七:Jquery VS Vue之杂项方法明细对照

2023-09-11 14:19:17 时间

系列文章目录

第一篇:Jquery VS Vue之差异比较概览
第二篇:Jquery VS Vue之元素操作明细对照
第三篇:Jquery VS Vue之事件监听明细对照
第四篇:Jquery VS Vue之网络请求明细对照
第五篇:Jquery VS Vue之杂项方法明细对照
第六篇:Jquery VS Vue之全局属性对照
第七篇:Jquery VS Vue之遍历方法对照
第八篇:Jquery VS Vue之页面动画明细对照



一、前言

本篇对比Jquery中的事件监听相关方法在vue中的实现,本文中的vue对应实现方法可能有多种方式,只列出我所知道的,若有其它对应的操作方法可留言给我补充。
jquery参考文档:jQuery 杂项方法
vue参考文档:Vue Api


二、明细

2.1 数据与页面元素绑定实现:

方法描述
data()向被选元素附加数据,或者从被选元素获取数据
removeData()移除之前存放的数据

在vue中的对应实现:
vue中使用模板语法的方式实现,data绑定元素到数据,在data中定义后通过{{}}的方式绑定数据。

<!-- 绑定一个全是 attribute 的对象 -->
<div v-bind="{ id: someProp, 'other-attr': otherProp }"></div>

2.2循环相关实现:

方法描述
get()获取由选择器指定的 DOM 元素
index()从匹配元素中搜索给定元素
size()在版本 1.8 中被废弃。返回被 jQuery 选择器匹配的 DOM 元素的数量
toArray()以数组的形式检索所有包含在 jQuery 集合中的所有 DOM 元素
pushStack()将一个DOM元素集合加入到jQuery栈

在vue中的对应实现:
vue中元素操作需要使用原生的js方法进行实现,所有无这几项方法对应的实现。

2.4其他jquery函数实现:

方法描述
$.noConflict()释放变量 $ 的 jQuery 控制权
$.param()创建数组或对象的序列化表示形式(可在生成 AJAX 请求时用于 URL 查询字符串中)
$.when()提供一种方法来执行一个或多个对象的回调函数

在vue中的对应实现:
vue中无对应的实现方法,可以引入第三方库进行实现。

三、总结

本篇汇总了jquery中一些杂项方法对应vue中的实现方式。