如何编写可在LWC中使用的查询选择器的JS?

问题描述

我有一个可以正常工作的HTML页面代码,但是当我尝试在LWC中使用它时,它不起作用,如何使其在LWC中起作用?

const theBlue = document.querySelector('svg .blue');
theBlue.style.setProperty('--stroke-dashoffset',180);
.blue {
  stroke-dasharray: 490;
  stroke-dashoffset: 490;
  animation: draw 2s linear forwards;
}

@keyframes draw {
  to {
    stroke-dashoffset: var(--stroke-dashoffset);
  }
}
<div>
  <svg version="1.1" baseProfile="full" width="400" height="300" xmlns="http://www.w3.org/2000/svg">
        <path class="grey" fill="none" stroke="#B7C4D2" stroke-width="10" d="M 136 277 A 100 100 0 1 1 264 277"></path>
        <path class="blue" fill="none" stroke="#30A7F4" stroke-width="10" d="M 136 277 A 100 100 0 1 1 264 277"></path>
      </svg>
</div>

除JS部分外,其他所有东西都可以正常工作。我该如何纠正?

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)