vue
文章平均质量分 87
阮喵喵
这个作者很懒,什么都没留下…
展开
-
在.vue单文件组件内运用模块化的Swiper.js并封装成简易的轮播图组件
在.vue单文件组件内运用模块化的Swiper.js并封装成简易的轮播图组件 本文关键词 .vue组件、Swiper.js、JS modules、轮播图 应用场景 在vue项目开发之中,我们需要使用到轮播图。可以使用各种组件库所提供的轮播图组件来实现。但是本文主要讨论Swiper.js的使用。 预备知识 了解.vue单文件组件的语法。 了解Swiper.js的API。 简单阅读过作者之前写的另一篇关于Swiper.js封装的文章。 轮播图组件编写 template模板的编写 结合Swiper的完整htm原创 2021-07-21 14:25:33 · 358 阅读 · 0 评论 -
Swiper.js轮播图插件用Vue封装成简单的组件示例
Swiper.js轮播图插件用Vue封装成简单的组件示例 应用场景 Swiper在Vue中的运用,一般是封装成一个组件。原因是Swiper对象的初始化以及模块化开发。 代码示例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <me.原创 2021-06-04 17:03:02 · 259 阅读 · 0 评论 -
Vue的v-model指令与方法绑定执行顺序所导致的数据更新不及时问题
Vue的v-model指令与方法绑定执行顺序所导致的数据更新不及时问题 在实际的vue项目开发中,可能会遇到v-model指令双向绑定的数据与标签绑定方法所回调的数据不同步的问题。这是由于v-model与标签绑定方法执行顺序之差所导致的。解决的办法是利用绑定方法先执行的方式来手动模拟v-model,进而实现数据的更新。 问题复现 观察如下的html代码: <!DOCTYPE html> <html lang="en"> <head> <meta char.原创 2021-05-18 02:59:36 · 3199 阅读 · 2 评论