对于React/Node/npm start的使用我还不是很熟悉。用npm start启动服务器后可以成功显示我的React代码,但是我需要进行一些调试。然而,我的控制台日志并没有输出到浏览器控制台上。接下来,我想去检查我的终端(我认为这是Node console.log 输出的地方),但是由于我使用了npm start,因此从中启动应用程序的终端卡在了这个界面上:
Compiled successfully!
You can now view my-app in the browser.
Local: http://localhost:3000/
On Your Network: http://[ip_address_here]:3000/
Note that the development build is not optimized.
To create a production build, use npm run build.
因此,我无法在此屏幕上阅读任何控制台输出。我觉得这应该是一个非常基础的修复程序,我可能只是忽略了一些非常明显的东西,但有人可以帮助我吗?谢谢。编辑:有人要求我分享一些代码,这里是它:
这是我的App.js文件的片段:
import React from 'react';
//quick class
class App extends React.Component {
constructor(props){
super(props);
this.state = {
testRows : null
}
this.getTest = this.getTest.bind(this);
}
//get some rows from my api using a local database with sqlite3
async getTest(){
try{
console.log("hello?");
const response = await fetch('http://localhost:3000/api/test');
if(response.ok){
const JSONresponse = response.json();
console.log(JSOnresponse);
this.setState({testRows : JSONresponse});
}
else{
this.setState({testRows: "test error"});
console.log('There was an error with the fetch');
}
}
catch(error){
console.log(error);
}
}
//render some text, a button, and the result
render(){
let testResults;
if(this.state.testRows){
testResults = Object.keys(this.state.testRows).map((data) => {
return <h1>{data.name}</h1>
}
)
}
else{
testResults = "null";
}
return(
<div>
<h2>Some testing going on here</h2>
<button onClick={this.getTest}>
Press me for test!
</button>
<h3>{testResults}</h3>
</div>
);
}
}
export default App;
这是我的api.js文件的片段:
apiRouter.get('/test', (req, res, next) => {
db.get('SELECT * FROM Test', (error, rows) => {
if(error){
console.log(error);
}
else{
console.log("got the test");
console.log(rows);
res.send(rows);
}
})
})
路由器已安装并且代码的其他部分也已就绪,但控制台日志未在任何地方显示(dev工具控制台或终端)。
apiRouter
是如何定义的? - Bergi