ReactJS＆Vivus SVGアニメーション

Question

私はreactJSには新しく、SVGをReactでアニメーション化しようとしていますが、いくつか問題があります。

私はhttps://www.npmjs.com/package/vivus

import React from "react"; 
import ReactDOM from "react-dom"; 
import Vivus from "vivus"; 

export default class MySkills extends React.Component { 
constructor() { 
    super(); 
    new Vivus('my-div', {duration: 200, file: 'link/to/my.svg'}); 
} 

render() { 
    return (
     <section id="MySkills" className="mySkills"> 
      <div className="wrapper"> 
       <div id="my-div"></div> 
      </div> 
     </section> 
    ); 
} 
} 

からVIVUSを得て、このtrows私にエラーが発生しました。私は問題がコンストラクタにあると思いますが、私はvivusオブジェクトをどこに置くべきかわかりません。

エラーメッセージ：

不明なエラー：VIVUS [コンストラクタ]：「要素」パラメータは部品が実装された後にあなたのVIVUSオブジェクトを初期化する必要があり、既存のID

Answer 1

とは関係ありません。

export default class MySkills extends React.Component { 
    constructor() { 
     super(); 

    } 
    componentDidMount(){ 
     new Vivus('my-div', {duration: 200, file: 'link/to/my.svg'}); 
    }  
    render() { 
     return (
      <section id="MySkills" className="mySkills"> 
       <div className="wrapper"> 
        <div id="my-div"></div> 
       </div> 
      </section> 
     ); 
    } 
}