藏经阁

使用nuxt,express,mysql,nginx创建个人博客系列-10

379
2020-01-24 18:37
10 个月前

增加tags路由和tags.html

添加一条/tags的路由规则，修改server/admin/routers/index.js

import tags from './tags'
router.use('/tags', checkNoLogin,tags)

创建tags路由文件 目录：server/admin/routers/tags.js

mport {
  Router
} from 'express'
const router = Router()
import config from '../../config'
import mysql from '../../libs/mysql'
import util from '../../util'
router.get('/',async (req,res,next)=>{
  let myConnect = await mysql.getConnect(); //获取数据库链接
  let sql = `select * from tags`;
  let result = await mysql.query(myConnect,sql); //查找所有的标签
  await mysql.release(myConnect);
  res.render('tags', {
    'module_dir': config.admin.route, 
    list:result //渲染到tags.html上
  })
})

目录：server/admin/views/tags.html
说明：显示所有的标签

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <% include header.ejs%>
    <title>tags</title>
</head>

<body>
  <% include nav.ejs%>
    <div class="container mt-3">
      <div class="container-fluid">
        <div class="row">
          <div class="col-12">
            <a class="btn btn-primary btn-outline-dark btn-block" href="<%= module_dir%>/tags/0" role="button">创建标签</a>
          </div>
        </div>
        <div class="row">
            <%if(list.length){%>
              <div class="col-12 bd-content mt-3">
                  <div class="bd-example">
                    <table class="table table-dark">
                      <thead>
                        <tr>
                          <th scope="col">id</th>
                          <th scope="col">name</th>
                          <th scope="col">修改时间</th>
                        </tr>
                      </thead>
                      <tbody>
                        <%for(i in list){%>
                          <tr>
                              <th scope="row"><a href="<%= module_dir%>/tags/<%= list[i]['id']%>"><%= list[i]['id']%></a></th>
                              <td><%= list[i]['name']%></td>
                              <td><%= list[i]['updated_at']%></td>
                          </tr>
                        <%}%>
                      </tbody>
                    </table>
                  </div>
                </div>
            <%}%>
        </div>
      </div>
    </div>
</body>
<script>
</script>

</html>

此时查看tags列表页 tags.html

上一篇-使用nuxt,express,mysql,nginx创建个人博客系列-09
下一篇-使用nuxt,express,mysql,nginx创建个人博客系列-11