[英]React error - expected semicolon after render method?
I'm trying to build a basic chat room app, and I'm having trouble understanding why my app component doesn't render. 我正在尝试构建一个基本的聊天室应用程序,但是我无法理解为什么我的应用程序组件无法呈现。 I expect this is probably a really basic issue, but I'm new to coding (and Stack Overflow) in general so it's escaping me.
我希望这可能是一个非常基本的问题,但是我一般对编码(和堆栈溢出)是陌生的,所以它在逃避我。
I've got the component set up similarly to one I already built that worked fine, but when I try to run, I get an error saying that a semicolon is expected in place of the curly brace right after I call the render method. 我已经将组件设置为与我已经构建的组件类似,并且可以正常工作,但是当我尝试运行时,出现一个错误,提示在调用render方法后,应该使用分号代替大括号。
I found another answer saying that this usually indicates invalid JSX syntax within the component, but I've rearranged it every way I can think of. 我找到了另一个答案,说这通常表示组件内的JSX语法无效,但是我已经以我能想到的所有方式对其进行了重新排列。 I tried just putting the semicolon there as a Hail Mary, but that predictably just caused more errors.
我尝试将分号作为“冰雹玛丽”放在那儿,但这可以预料会导致更多错误。
import React, {Component} from 'react';
import RoomList from './components/RoomList'
import MessageList from './components/MessageList'
import './App.css';
import * as firebase from 'firebase';
// <script src="https://www.gstatic.com/firebasejs/6.1.1/firebase-app.js"></script>
// Your web app's Firebase configuration
var firebaseConfig = {
apiKey: "AIzaSyA9oZW7yL_BgNtkODEkOftd8SztNDm6aLw",
authDomain: "bloc-chat-e5e85.firebaseapp.com",
databaseURL: "https://bloc-chat-e5e85.firebaseio.com",
projectId: "bloc-chat-e5e85",
storageBucket: "bloc-chat-e5e85.appspot.com",
messagingSenderId: "716557708964",
appId: "1:716557708964:web:69e9e607313399b0"
};
// Initialize Firebase
firebase.initializeApp(firebaseConfig);
class App extends Component {
constructor(props) {
super(props);
this.state = {
activeRoom: null
}
render() {
return (
<div className="App">
<header className="App-header">
<RoomList firebase={firebase}>
</RoomList>
</header>
</div>
);
}
}
export default App;
This should display a list of available chat rooms and an input field for adding more, but the error message is as follows: 这应该显示可用聊天室的列表以及用于添加更多聊天室的输入字段,但是错误消息如下:
Line 32: Parsing error: Unexpected token, expected ";"
30 | }
31 |
> 32 | render() {
| ^
You forgot the }
of constructor
您忘记了
constructor
的}
class App extends Component {
constructor(props) {
super(props);
this.state = {
activeRoom: null
}
}
render() {
return (
<div className="App">
<header className="App-header">
<RoomList firebase={firebase}>
</RoomList>
</header>
</div>
);
}
}
export default App;
我认为您缺少用于关闭构造函数的右花括号。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.