vue.js中怎么集成codeMirror

    new Vue({
        el: '#app',
        data: {
            editor: null
        },
        mounted() {
            this.init()
        },
        methods: {
            init() {
                this.editor = CodeMirror.fromTextArea(document.getElementById("editor_demo"), {
                  lineNumbers: true,
                  indentWithTabs: true,
                  mode: "python",
                  matchBrackets: true
                });
                this.editor.setSize('auto','600px');
            },
            handleAdd() {
                axios.post(site_url + "create_blog/", {"content": this.editor.getValue()}).then(res => {
                    if (res.data.result) {
                        this.$message.success('添加内容成功');
                    } else {
                        this.$message.error('添加内容失败');
                    }
                }, 'json');
            }
        }
    })

2.后端代码

def create_blog(request):
    data = json.loads(request.body)
    content = data.get("content")
    print(content)
    ...
    return JsonResponse({"result": True})

显示效果

关于vue.js中怎么集成codeMirror就分享到这里了，希望以上内容可以对大家有一定的帮助，可以学到更多知识。如果觉得文章不错，可以把它分享出去让更多的人看到。