Visual Studio 代码解析错误，无法修复

Question

"Parsing error: Adjacent JSX elements must be wrapped in an enclosing tag. Did you want a JSX fragment <>...?". That's the error that occurs which seems to be on the last bracket ");" but I've tried everything yet my code will still not compile. I am new to this so the error might be obvious

 import React, { Component } from 'react'; import Header from '../Header/Header'; class MessageBoard extends Component { state = {} render() { return ( <div> <h1>Message Board</h1> <h2>Got any questions? Ask away!</h2> </div> <div class = "chat-popup" id="myform"> <form action="/action_page.php" class="form-container"> <h1>Chat</h1> <label for="msg"> <b>Message</b></label> <textarea placeholder="Type message.." name="msg" required> </textarea> <button type= "submit" class = "btn">Send</button> <button type="button" class="btn cancel" onclick="closeform()">Close</button> </form> </div> ); }

Answer 1

JSX expressions must have one parent element

Enclose all returned html inside an element. For example a <div></div> :

import React, { Component } from 'react';
import Header from '../Header/Header';

class MessageBoard extends Component {
    state = {}
    render() {
        return (
            <div>
                <div>
                    <h1>Message Board</h1>
                    <h2>Got any questions? Ask away!</h2>
                </div>

                <div class = "chat-popup"
                id="myform">
                    <form action="/action_page.php"
                class="form-container">
                    <h1>Chat</h1>

                    <label for="msg">
                <b>Message</b></label>
                        <textarea placeholder="Type
                    message.." name="msg" required>
                    </textarea>

                        <button type= "submit"
                    class = "btn">Send</button>
                        <button type="button"
                    class="btn cancel"
                    onclick="closeform()">Close</button>
                    </form>
                </div>
            </div>
        );

    }
} //<--- this bracket is missing in your example

Also, you are mising the last } but I think this is a typo while copy pasting.