adjacent jsx elements must be wrapped in an enclosing tag
This is a topic that many people are looking for. https://granthamandira.org/ is a channel providing useful information about learning, life, digital marketing and online courses …. it will help you have an overview and solid multi-faceted knowledge . Today, https://granthamandira.org/ would like to introduce to you Adjacent JSX Elements Must be Wrapped in an Enclosing Tag. Following along are instructions in the video below:
welcome back to JavaScript school today were gonna talk about a common error that new react developers encounter and its called adjacent JSX elements must be wrapped in an ax closing tag so lets jump right into it Im going to open up visual studio code and lets say that you are going to modify your react application and here I have a create react app its returns this div right here but a lot of
times all right at least Ive experienced this when I was a new react developer I would put an additional tag right here at the end and if you run this you will receive an error message because react requires that only one element is removed as returned from the return statement and as you notice there I have two elements so react does a really nice job of giving good error error description as to what
the problem might be but you still might not be quite clear what the problem is so as youre probably aware JSX is the HTML its being returned in the JavaScript and so here we have the div tag here we have a paragraph tag and really what we need to do is just return one element and not two elements so here its actually pointing out that theres a parsing error adjacent JSX elements must be
wrapped in a closing tag do you want do you want to JSX fragment so its suggesting rather than wrapping this in another div tag which may be detrimental to you know what youre trying to render on your screen you can actually use Java a react fragment element which is a new element so we can actually enclose this and say react dot fragment and then if we take this closing tag move it down here
were only returning one element but it actually render as a div and then a paragraph the fragment will actually be just thrown out and so it automatically renders and that error message goes away so I hope that helps you with any problems that youre having I appreciate it she gave a thumbs up to this video if it did and if youd like more videos like this please subscribe in the notification though you 
tags:
javascript, react, jsx, error, enclosing tag, must be wrapped in enclosing t, adjacent JSX Elements
Thank you for watching all the articles on the topic Adjacent JSX Elements Must be Wrapped in an Enclosing Tag. All shares of https://granthamandira.org/ are very good. We hope you are satisfied with the article. For any questions, please leave a comment below. Hopefully you guys support our website even more.
