05-我的博客筆記-博客前臺展現

後臺管理界面搭建完成後作前臺的展現就很是容易了，這裏只記錄一些注意點，具體參考demo

1.前臺展現的不少接口不須要token驗證

var jwt = require('express-jwt');
app.use(jwt({secret: 'jwt-secret', debug: true}).unless({
    path: ['/user/regiest', '/user/login', '/admin/login', '/works/list', '/works/detail']
}))
// /tourist 接口忽略401報錯
app.use(function (err, req, res, next) {
    if (err.name === 'UnauthorizedError') {
        if (req.path.indexOf("/tourist") != -1 || req.path.indexOf("/static") != -1) {
            next()
        } else {
            res.status(401).send('invalid token...');
        }
    }
});

2.回覆評論：將該回復加入數組，更新數組

// 回覆評論
router.post('/reply', (req, res, next) => {

    let articleId = req.body.articleId
    let commentId = req.body.commentId

    var reply = new Reply({
        replyUser: req.body.replyUser,
        content: req.body.content,
        acceptUser: req.body.acceptUser,
        replyTimer: new Date()
    })

    Article.findOne({_id: articleId}).then((article) => {

         var arr = []
        for (let i = 0; i < article.commentList.length; i ++) {
            let comment = article.commentList[i]
            if (comment._id == commentId) {
                comment.replyArr.push(reply)
            }
            arr.push(comment)
        }

        Article.updateOne({_id: articleId}, {commentList: arr}).then((article) => {
            responseData.success = true
            responseData.message = '回覆成功'
            res.json(responseData)
        }).catch((err) => {
            responseData.success = false
            responseData.message = err.message
            res.json(responseData)
        })

    }).catch((err) => {
        responseData.success = false
        responseData.message = err.message
        res.json(responseData)
    })
})

3.vue.js中$set與數組更新:$set()方法更新時，頁面會所有更新一遍

data:{
    arr1 = ['a','b','c'];
    arr2 = [‘foo’,'bar','baz'];      
}

vm.arr1[1] = 'alpha';
vm.$set(vm.arr2, 1, 'alpha');

結果
arr1 = ['a', 'alpha', 'b', 'c'];
arr2 = [‘foo’, 'alpha', 'bar','baz'];

項目上傳  github 每次提交都是一個分支

線上地址