Javascript 事件处理和与节点的反应&；表达

我在试着学习如何反应，所以我有一个非常愚蠢的问题

我正在试图弄清楚事件处理是如何工作的。
我的代码：

//app.js
var express=需要（“express”）；
var reactViews=require（'express-react-views'）；
var-app=express（）；
app.set（'views'，'u dirname+'/views'）；
app.set（'view engine'，'jsx'）；
app.engine（'jsx'，reactViews.createEngine（））；
变量路由=需要（'./路由'）；
app.get（'/'，routes.index）；
var server=app.listen（3000，函数（）{
console.log（“在端口3000上侦听”）；
});
//routes/index.js
exports.index=函数（请求、恢复）{
res.render（'index'，{姓名：'John'，职业：'Driver'，年龄：22}）；
};
//视图/布局/default.jsx
var React=要求（'React'）；
类DefaultLayout扩展了React.Component{
render（）{
返回(
{this.props.title}
{this.props.children}
);
}
}
module.exports=默认布局；

渲染部分：
我一直在尝试一些不同的事情。主要是尝试让jquery工作（以前使用过，所以很熟悉），并登录到客户端控制台。
我认为我的问题是，这都是在服务器端呈现的，所以脚本没有嵌入（对吗？）。所以我猜内容必须是动态呈现的，但是我该怎么做呢

//视图/index.jsx
var React=要求（'React'）；
var DefaultLayout=require（'./layouts/default'）；
var jsdom=require（“jsdom”）；
var$=require（'jquery'）（jsdom.jsdom（）.defaultView）；
函数countTo（n:number）：字符串{
var a=[]；
对于（变量i=0；i{
//e.预防违约（）；
//log（“链接被点击了”）；
// }
render（）{
返回(
你好{this.props.name}

职业{this.props.occulation}

{this.props.name}的年龄是{this.props.Age}


我可以数到10：
{countTo（10）}

);
}
}
module.exports=HelloMessage；

---

要使其动态呈现，我想我必须更改app.js文件中的一些内容。在哪里可以找到有关如何执行此操作的信息？

在//views/index.jsx中有这样的代码：

<a id="testlink" href="#" onChange={this.handleClick}>
  Click me
</a>

也许你想这么做

<a id="testlink" href="#" onClick={this.handleClick}>
  Click me
</a>

（onChange->onClick）

---

在本部分的其余部分，代码看起来还可以

为什么要尝试将jquery与react结合使用？这毫无意义…我无法让它与logCmd（）或handleClick函数配合使用，因此我尝试使用jquery如果您刚刚开始学习react，那么在浏览器中使用纯react可能会更容易些？我的意思是，你可以排除所有关于backside的内容我已经尝试过onClick和onChange，但是当我单击按钮时，console.log不会启动，只有当我加载页面时，我想你有这样的行为是因为服务器端的东西。对不起，现在还不能挖。也许你会发现一些有趣的东西，比如服务器端渲染的

nextJS