🐛 Fix: 修复评论不能换行的问题

package.json

@@ -11,7 +11,10 @@
   "dependencies": {
     "autosize": "^4.0.2",
     "axios": "^0.19.0",
-    "marked": "^0.8.0",
+    "highlight": "^0.2.4",
+    "highlight.js": "^10.1.1",
+    "highlightjs": "^9.16.2",
+    "marked": "^1.1.0",
     "md5": "^2.2.1",
     "promise.prototype.finally": "^3.1.2",
     "ua-parser-js": "^0.7.21",

src/components/CommentEditor.vue

@@ -286,27 +286,30 @@
         methods: {
             handleSubmitClick() {
                 if (isEmpty(this.comment.author)) {
-                    this.warnings.push("评论者昵称不能为空");
-                    return;
+                    // this.warnings.push("评论者昵称不能为空");
+                    // return;
+                    this.comment.author = 'Anonymous';
                 }
                 if (isEmpty(this.comment.email)) {
                     this.warnings.push("邮箱不能为空");
                     return;
+                    // this.comment.email = '[email protected]';
                 }
                 if (isEmpty(this.comment.content)) {
                     this.warnings.push("评论内容不能为空");
                     return;
                 }
                 // comment 需要是 Markdown 格式的
-                this.comment.content = marked(this.comment.content);
+                const content = marked(this.comment.content);
+
                 // Submit the comment
                 this.comment.postId = this.targetId;
                 if (this.replyComment) {
                     // Set parent id if available
                     this.comment.parentId = this.replyComment.id;
                 }
                 commentApi
-                    .createComment(this.target, this.comment)
+                    .createComment(this.target, {...this.comment, content})
                     .then(response => {
                         // Store comment author, email, authorUrl
                         localStorage.setItem("comment-author", this.comment.author);

src/components/CommentNode.vue

@@ -95,7 +95,7 @@
 </template>
 <script>
     import "./index";
-    import {timeAgo} from "@/utils/util";
+    import {timeAgo, decodeHTML} from "@/utils/util";
     import ua from "ua-parser-js";
     import marked from "marked";
 
@@ -159,7 +159,7 @@
                         '">@' + this.comment.parentAuthor +
                         "</a>";
                 }
-                return at + marked(this.comment.content);
+                return at + marked(decodeHTML(this.comment.content));
             },
             createTimeAgo() {
                 return timeAgo(this.comment.createTime);

src/styles/global.scss

@@ -590,7 +590,7 @@
     }
 
     .comment-content.markdown-body > p {
-        display: inline-block;
+        //display: inline-block;
         margin-left: .5rem;
     }
     .comment-content.markdown-body a {

src/utils/util.js

@@ -92,4 +92,13 @@ export function getUrlKey(name) {
             ) || "")[1].replace(/\+/g, "%20")
         ) || null
     );
+}
+
+// 特殊字符转义成HTML标签
+export function decodeHTML(html){
+    var output, elem = document.createElement('div');
+    elem.innerHTML = html;
+    output = elem.innerText || elem.textContent;
+    elem = null;
+    return output;
 }