限制输入字数

sgzb-ui/src/views/system/notice/index.vue

@@ -261,7 +261,7 @@
                                 v-model="form.noticeContent"
                                 :min-height="192"
                                 :max-length="200"
-                                :placeholder="'请输入内容'"
+                                @input="handleEditorChange"
                             />
                         </el-form-item>
                     </el-col>
@@ -433,6 +433,20 @@
                     })
                     .catch(() => {})
             },
+            handleEditorChange(value) {
+                let parser = new DOMParser()
+                let doc = parser.parseFromString(value, "text/html")
+                let text = doc.body.textContent || ""
+                // 当text.length 超过200 时候,提示用户并且截取前200个字符
+                if (text.length > 200) {
+                    this.$message({
+                        message: '公告内容不能超过200个字符!',
+                        type: 'warning'
+                    })
+                    this.form.noticeContent = text.substring(0, 200)
+                    return
+                }
+            },
         },
     }
 </script>