제공된 요소가 문서 내에 없습니다. Reactjs

Question

사용자에게 HTML 인보이스를 Image로 보내려고합니다.

다음

Provided element is not within a Document

내가 componentDidMount()

html2canvas(document.getElementById('invoice'), { 
     logging: true, 
     profile: true, 
     useCORS: true}).then(function(canvas) { 
    var data = canvas.toDataURL('image/jpeg', 0.9); 
    var src = encodeURI(data); 
    console.log(src); 
}); 

그리고 송장에서 할 노력하고 무엇인가

내가 html2canvas 라이브러리를 사용하고 그 목적을 위해

,하지만 지속적으로 나에게 오류를주고있다 요소가 DOM에 존재합니다.

무엇이 잘못 될 수 있습니까?

Answer 1

아마 refs으로 요소를 캡처하려고합니다.

그래서 당신의 구성 요소는 다음과 같이 표시됩니다

class Invoice extends React.Component { 
    componentDidMount(){ 
     html2canvas(this.invoice, { 
       logging: true, 
       profile: true, 
       useCORS: true}).then(function(canvas) { 
      var data = canvas.toDataURL('image/jpeg', 0.9); 
      var src = encodeURI(data); 
      console.log(src); 
     }); 
    } 
    render(){ 
     return <div ref={r => this.invoice = r}>....</div> 
    } 
}