How to use svg from the folder path in appendchild method javascript or reactjs?

Question

i am new to reactjs and i stuck with appending svg element to the div element.

What is that i want to implement? I have a div element created dynamically like below.

Answer 1

If you want to create element dynamically I would suggest you to use your Component's state. In react it is not good practice to operate with DOM directly like you do. So your code should looks like:

import React from "react";
import {ReactComponent as SvgName} from '../svg/name.svg'

class SomeClass extends React.Component {
  state = {
    renderImage: false,
  }

  componentDidMount() {
    if(someConditionMets) {
       this.setState({renderImage: true});
    }
  }

  render() {
    if (this.state.renderImage) return 
;

    return null;
  }
}

export default SomeClass;

Or if you want your div to render every time you can change render method to:

  render() {
    return 
{this.state.renderImage && }
  }