I need to remove the attribute "data-processed" from a child div of a component. I cant just set it to null or false, it needs to be removed.

In classic JS, I'd need something like:

$('#mermaid').html(node.data.graph).removeAttr('data-processed');

But that will not seem to work here. I have used useRef to specify the ref to the div, but I cannot find any documentation on how to remove the attribute from the element at the ref. Is this at all possible to do in react?

CodePudding user response：

You can use vanilla removeAttribute method on the DOM node using useRef. https://developer.mozilla.org/en-US/docs/Web/API/Element/removeAttribute

const domRef = useRef();

domRef.current.removeAttribute('data-processed');

CodePudding user response：

You have 2 options.

1. Using removeAttribute method on element:

document.getElementById('mermaid').removeAttribute('data-processed')

2. Using ref (which is better):

elementRef.current.removeAttribute('data-processed');