解決tui-editor布局錯誤失效問題(Vue-Element-Admin)


更新:突然想起來會不會是兼容或者版本問題?


使用tui-editor遇到markdown預覽樣式錯誤,也不清楚是不是版本的問題,改了下源碼之后效果正常了

打開控制台看到幾個類名不對勁,te-editorte-md-splitterte-preview應該是並列關系,這里變成了嵌套,初步排除是插件的自定義配置問題

打開node_modules包中的tui-editor文件夾,搜索一下``te-preview`看看是在什么地方渲染的

在js文件中搜索 containerTmpl 變量

var containerTmpl = ['<div class="tui-editor">', '<div class="te-md-container">', '<div class="te-editor" />', '<div class="te-md-splitter" />', '<div class="te-preview" />', '</div>', '<div class="te-ww-container">', '<div class="te-editor" />', '</div>', '</div>'].join('');

看到其中有些div寫成了自閉和標簽,自己加上</div>,然后將所有js文件中containerTmpl替換

var containerTmpl = ['<div class="tui-editor">', '<div class="te-md-container">', '<div class="te-editor">', '</div>', '<div class="te-md-splitter" >', '</div>', '<div class="te-preview">', '</div>', '</div>', '<div class="te-ww-container">', '<div class="te-editor">', '</div>', '</div>', '</div>'].join('');

這回就渲染正確了


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM