首页 > 其他分享 >【坑】VUE中动态数据使用 wow.js 没效果的问题

【坑】VUE中动态数据使用 wow.js 没效果的问题

时间:2023-09-05 20:13:28浏览次数:33  
标签:nextTick VUE wow js init mounted

一般来说正常使用都是在mounted 函数中

mounted() {
    this.$nextTick(() => {
         this.$wow.init()
    })
}

这样如果是死数据是可以正常出现效果的 但是如果是请求回来的数据是没有效果的

需要改一下生成时机    此处的newList 即为请求的数据

watch: {
    newslist () {
      this.$nextTick(()=>{
           this.$wow.init()
      })
    }
}

这样即可

标签:nextTick,VUE,wow,js,init,mounted
From: https://www.cnblogs.com/shirunfeng/p/17680685.html

相关文章

  • Vue3实现批量打印二维码与条形码
    (二维码与条形码在vue3中的使用)欢迎阅览本篇文章这篇文章是我在工作途中对批量生成二维码的一些见解,例如vue-qr(二维码)与jsbarcode(条形码)在vxe-table表格中的使用,二维码与条形码的批量生成与打印(打印时一页一个码)等。注意!本篇文章的所有代码均使用setup语法糖与TypeScript,请确保......
  • Node.js 使用 officecrypto-tool 读取加密的 Excel (xls, xlsx) 和 Word( docx)文档
    Node.js使用officecrypto-tool读取加密的Excel(xls,xlsx)和Word(docx)文档,还支持xlsx和docx文件的加密(具体使用看文档)。暂时不支持doc文件的解密传送门:officecrypto-tool读取加密的Excel示例一:xlsx-populate//只支持xlsx,xlsx-populate自带了解密功能,/......
  • vue3如何监听 props 的变化?
    背景实际开发过程中,当需要通过watch 监听传入的props的某个值的变化,来动态改变组件内部的样式,实现方式如下:exportdefault{name:'countdown',props:{showBox:{type:Boolean,required:true,default:false},},setup(prop......
  • vue语言中的keep-alive的作用
    在前端Vue语言中,keep-alive是一个抽象组件,用于在Vue组件树中缓存动态组件。它可以有效地保留组件的状态,以避免在组件之间切换时重复渲染和销毁组件,从而提高性能。使用keep-alive包裹动态组件后,当动态组件被切换时,它将会被缓存,而不是被销毁。这样,组件的状态、DOM以及所有的子组件......
  • vue项目新建 端口更改
    vue项目新建步骤vite创建vue3项目(最简单):在需要的文件目录中输入cmd命令,打开命令窗口,在当前文件目录下创建项目(直接打开命令窗口,默认C盘创建项目)第一步:npminitvite-appvue-code//code为项目名第二步:cd./vue-code//进入项目第三步:npminstall//安装依赖包第四......
  • vue3.0 el-table 动态合并单元格
    <el-tablev-resize:34style="margin:10px010px":data="tableData":header-cell-style="{background:'#F6F6F6',height:'10px','text-align':'center'}":......
  • antd限制开始时间与结束时间范围是30天,并不能选择当前日期之后的日期 vue3(默认展示近7
    <a-range-picker:value="hackValue||dateArr":disabled-date="disabledDate"style="width:240px"separator="~":allow-cl......
  • Vue3带来的新变化
    Vue3带来的新变化性能提升首次渲染更快diff算法更快内存占用更少打包体积变小更好的Typescript支持CompositionAPI (重点)在使用vue2.x版本开发较复杂的组件时,逻辑难以复用,组合式api的出现可以解决此类问题相关阅读:Vue3中文文档 https://vue3js.cn/docs/zh/......
  • Vue2 中vuex和store基本用法——取值之this.$store.getters.getValue & 修改值之this.
        参考:https://blog.csdn.net/weixin_44867717/article/details/124133304 项目实例:      ......
  • jmeter JSON提取器匹配值设置以及参数值调用
    JSON匹配值设置以及参数调用-1:获取的返回值可能有多个,调用参数值时:${参数名_数字},例如:获取第一个值${参数名_1},获取第3个值${参数名_3}   数字:获取参数值中的第几个值,例如设置为5,获取返回值的第5个值,参数调用:${参数名}0:随机获取1个值,参数调用:${参数名}注意:匹配值有......