我如何知道是否呈现了filepond？

Question

我需要手动操作一些DOM属性(动态更改文件元素的样式)。我通过document.getElementById ("filepond - item-" + id)搜索所需的元素。

但是，如果还没有呈现带有初始文件的Filepond DOM元素(getElementById()没有找到任何元素)，我就会遇到问题。

我目前正在用this.$NextTick()解决这个问题

<template>
 <file-pond
    ref="filepond"
    :server="server"
    :files="files"
    @initfile.once="markMainImage"
  />
</template>
<script>
[...]
  methods: {
    async markMainImage () {
      await this. $ nextTick ();
      document.getElementById ("filepond - item-" + id).classList.add ("main-image");
    },
  },
</script>

但这并不方便，也不太可靠。FilePond:loaded事件可以用于此目的(https://pqina.nl/filepond/docs/api/instance/events/#filepond-loaded-event)吗？

如果是的话，你如何在Vue中使用它？

@loaded="markMainImage"不开火

或者是否有另一种方法可以确定filepond是否与初始文件一起呈现？

Answer 1

感谢Rik for comment

@addfile.once="markMainImage"

它起作用了。