語義-UI-反應語法錯誤：相鄰JSX元素必須被包裹在封閉標記

我使用語義-UI-反應以建立一個新的用戶的一種形式：語義-UI-反應語法錯誤：相鄰JSX元素必須被包裹在封閉標記

import React from 'react'; 
import { Form } from 'semantic-ui-react'; 
import {createUser} from '../../../actions/userAction'; 

class UserAddModalForm extends React.Component { 
    constructor(props) { 
    super(props); 
    } 

    handleSubmit(event, props) { 
    event.preventDefault(); 
    let body = { 
     lastname: event.target.lastName.value, 
     firstname: event.target.firstName.value, 
     username: event.target.userName.value, 
     email: event.target.email.value, 
    } 
    props.dispatch(createUser(body)); 
    props.onCancel(); 
    } 

    render() { 
    return(
     <div> 
     <Form onSubmit={ (event) => this.handleSubmit(event, this.props)> 
      <Form.Field> 
      <label>Last Name</label> 
      <input name='lastName' /> 
      </Form.Field> 
      <Form.Field> 
      <label>First Name</label> 
      <input name='firstName' /> 
      </Form.Field> 
      <Form.Field> 
      <label>Username</label> 
      <input name='userName' /> 
      </Form.Field> 
      <Form.Field> 
      <label>Email Address</label> 
      <input name='email' /> 
      </Form.Field> 
      <Button type='submit'>Submit</Button> 
      <Button onClick={ this.props.onCancel }>Cancel</Button> 
     </Form> 
     </div> 
    ) 
    } 
} 

export default UserAddModalForm;

當我建立我收到此錯誤：

./src/components/ui/users/UserAddModalForm.js 
Syntax error: Adjacent JSX elements must be wrapped in an enclosing tag (30:10) 

    28 |    <input name='lastName' /> 
    29 |   </Form.Field> 
> 30 |   <Form.Field> 
    |   ^
    31 |    <label>First Name</label> 
    32 |    <input name='firstName' /> 
    33 |   </Form.Field>

我周圍，就用Google搜索我可以告訴我附上我JSX元素在一個div。我在應用程序的其他部分使用了語義反饋組件，沒有任何錯誤，我不知道爲什麼構建會掛在這個上。

任何和所有的幫助將不勝感激。謝謝。

來源

2017-10-06 salols

您忘記關閉您提交的功能。添加一個結束大括號 – fungusanthrax

@fungusanthrax - 基督我一直在尋找這個40分鐘，謝謝 – salols

請注意當你收到一個看起來沒問題的區域的錯誤時，通常錯誤位於該區域上方，編譯器運行代碼，這是錯誤發生的地方，因爲有些東西破壞了它以上 – fungusanthrax

<Form onSubmit={ (event) => this.handleSubmit(event, this.props)>

應該

<Form onSubmit={ (event) => this.handleSubmit(event, this.props)}>

來源

2017-10-06 17:21:06 fungusanthrax

語義-UI-反應語法錯誤：相鄰JSX元素必須被包裹在封閉標記

回答

相關問題