javascript - 前端开发框架express，在他的模板引擎下怎么给按钮添加绑定事件？

Question

工作中用到了express，也是第一次使用express
模板引擎也是一时半会适应不了！不过这不是重点。
第一个问题：怎么添加点击事件（类似vue，angular什么的写法：v-bind=xxx???有这样的？？）

ul(class="communityList")
    each item in tree
      a(href="joingroup/1")
           li(class="CommList")
               p(class="comLogo")
                   if item.img
                       img(src="#{item['img']}")
                   else
                       img(src="http://cdn.duitang.com/.thumb.600_0.jpeg")
               p(class="content")
                   p(class="cTitle")=item['name']
                   p(class="comInfo")="简介：" + item['content']
                   if item['join'] == 0
                       p(class="button")="加入" /* 我想给这个按钮添加点击事件 */
                   else
               a(href="" class="ybutton")="已加入"

第二个问题：
页面数据全从接口拿
所以：

router.get('/join', function (req, res, next) {


    request.post({url: 'https://api.xxx.com/bbs/list', form: {userId: 10000}}, function (err, httpResponse, body) {

        body = JSON.parse(body);

        res.render('join', {tree: body['return']});

    });
    /* 如果把第二个接口写在这里 也不行，再次render 会报错！！！ */
});

这一个接口只能拿页面的一部分数据，
但是，还有一部分数据需要访问另一个接口，总不能写两次路由吧(上面那个是用路由写的)？写两个也没用啊。

问题就是这两个，不知道表达清楚没有。
1、怎么给元素绑定事件？
2、怎么在同一个页面上访问两个接口

Answer 1

1.可以直接在元素上写onclick="要执行的函数",或者在模板底部引入新js,在js中查找dom元素绑定,比如
var ele=document.getElement("button").addEventlistener("click",function(){要执行的逻辑})
2.可以绑定动态name,或者加个参数判断

Answer 2

第一个问题：
https://forum-archive.vuejs.o...
第二个问题：
你可以在后端请求两个接口，然后把两个接口请求到的数据放进一个对象里面在页面上使用，也可以前端页面用js请求另一个接口的数据然后使用

Answer 3

另外写一个js文件，在pug里面通过script标签引入，
js文件要用express的static方法包装一下。

比如在koa下的写法：

app.use(mount('/static', serve(__dirname + '/app/static')));