Ошибка Adjacent JSX elements must be wrapped in an enclosing tag. Did you want a JSX fragment
Primary tabs
Syntax Error: SyntaxError: Adjacent JSX elements must be wrapped in an enclosing tag. Did you want a JSX fragment <>...</>?
Рабочим оказывается вариант вроде:
function Welcome(props) {
return (
<React.Fragment>
<div className="uk-vertical-align uk-text-center uk-height-1-1">
<div className="uk-vertical-align-middle" style={{width: "250px"}}>
<img className="uk-margin-bottom" width="140" height="120" src="" alt=""/>
<form className="uk-panel uk-panel-box uk-form">
<div className="uk-form-row">
<input className="uk-width-1-1 uk-form-large" type="text" placeholder="Username"/>
</div>
<div className="uk-form-row">
<input className="uk-width-1-1 uk-form-large" type="text" placeholder="Password"/>
</div>
<div className="uk-form-row">
<a className="uk-width-1-1 uk-button uk-button-primary uk-button-large" href="#">Login</a>
</div>
<div className="uk-form-row uk-text-small">
<label className="uk-float-left"><input type="checkbox"/> Remember Me</label>
<a className="uk-float-right uk-link uk-link-muted" href="#">Forgot Password?</a>
</div>
</form>
</div>
</div>
<h1>Привеееет, {props.name}</h1>
</React.Fragment>
);
}
const element = <Welcome name="React.js! ✅" />;
ReactDOM.render(
element,
document.getElementById('hello')
);
-- если возвращаем несколько html-элементов, их нужно обернуть в React.Fragment, обратите внимание, что если вы начинаете прописывать html с новой строки после return, то будут нужны скобки.
- Log in to post comments
- 4020 reads