Question

我在尝试托管我的网络应用时遇到此错误。问题似乎在于React.Fragment调用。

×
React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in.

Check your code at search-input.js:8.
SearchInput
src/components/search-input.js:8
   5 | 
   6 | //This is the Presentation component
   7 | const SearchInput = ({searchInput}) =>
>  8 |   <React.Fragment>
   9 |     <div>{searchInput}</div>
  10 |   </React.Fragment>
  11 | 
View compiled
Search
src/containers/search.js:47
  44 |     <input onChange={(input) => this.searchInput(input)}></input>
  45 |   </div>
  46 |   <div className='row'>
> 47 |     <SearchInput searchInput = {this.state.searchInput}/>
  48 |     <button onClick={this.buttonClick} className='btn btn-danger btn-xs'>SEARCH</button>
  49 |   </div>
  50 | </div>
View compiled
Search
src/containers/search.js:41
  38 | 
  39 | render(){
  40 |   return(
> 41 |     <div className='search'>
  42 |       <div className='row'>
  43 |         <h1>Sentiment</h1>
  44 |         <input onChange={(input) => this.searchInput(input)}></input>
View compiled
Welcome
src/welcome.js:12
   9 | const Welcome = ({}) =>
  10 |   <div className='row'>
  11 |     <div className='col-xs-5'>
> 12 |       <Search/>
  13 |       <Link to="/search">
  14 |           <button className='btn btn-xs'>Go to Map</button>
  15 |       </Link>
View compiled
App
src/App.js:23
  20 | <h1 className="App-title">{this.state.title}</h1>
  21 | 
  22 | {/* We rended diffrent component based on the path */}
> 23 | <Route exact path="/" component={Welcome}/>
  24 | <Route path="/search" component={Discover}/>
  25 | 
  26 | 
View compiled
App
src/App.js:19
  16 | render() {
  17 |   return (
  18 |     <div className="App">
> 19 |       <header className="App-header">
  20 |         <h1 className="App-title">{this.state.title}</h1>
  21 | 
  22 |         {/* We rended diffrent component based on the path */}
View compiled
(anonymous function)
src/index.js:10
   7 | 
   8 | ReactDOM.render((
   9 |     <BrowserRouter>
> 10 |         <App />
  11 |     </BrowserRouter>
  12 | ), document.getElementById('root'));
  13 | 
View compiled
This screen is visible only in development. It will not appear if the app crashes in production.
Open your browser’s developer console to further inspect this error.

我不知道是什么导致了这个错误。我假设React.Fragment被正确导出，所以我猜我的反应安装有问题。我该如何解决这个问题？

Answer 1

确保您使用的是React@^v16.2.0

React不会让我使用React.Fragment

1 个答案: