如何在两个单独的SVG图像中填充多个类似路径?

我正在制作用户与SVG交互并在单击时用颜色填充的网站,我设法在单击时进行路径填充,但我目前遇到的问题是因为有2个SVG,当您单击以填充SVG1上的某些路径时,有时还需要填充SVG2路径。我想在SVG中添加一些类,然后检查SVG1路径是否与SVG2路径具有相同的类,然后根据该条件填充这两个路径。我想知道是否有更简单的方法。也不是所有的路径都应该填充相同的颜色只有一些,我看不到任何图案。我还考虑添加一些元数据,但这可能会使事情更加复杂。

  mounted() {
    let self = this;
    this.$nextTick(() => {
      Array(...document.getElementsByTagName('svg')).forEach((obj) => {
        console.log(obj)
        let children = obj.getElementsByTagName('*')
        console.dir(children)
        let arr = Array(...children);
        arr.forEach(function(item) {
          if (item.classList.contains("frontstich")) {
            item.style.fill = 'black'
          }

          //I WAS THINKING OF ADDING CONDITION MENTIONED ABOVE HERE

          else {
            item.addEventListener('click', function() {
              item.style.fill = self.color;
            })
          }
        });

      })
    })
  }

这是我在Vue组件中安装的部分