更新:突然想起来会不会是兼容或者版本问题?


使用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('');

这回就渲染正确了

解决tui-editor布局错误失效问题(Vue-Element-Admin)的更多相关文章

  1. vue element Admin - 修改浏览器标签名 + 添加tagView标签 +固定导航头部 + 添加侧边栏Logo

    1 .修改浏览器标签名称: 修改浏览器标签名称在文件:\src\settings.js   image.png 2 .修改固定头部Header和侧边栏 Logo:   image.png 1)侧边栏文 ...

  2. vue+element ui中select组件选择失效问题原因与解决方法

    codejing 2020-07-10 09:13:31  652  收藏 分类专栏: Web Vue Element UI 版权 .当表单form赋完值后,如果后续又对form中某一属性值进行操作如 ...

  3. legend2---开发日志5(如何解决插件的延迟问题,比如vue)

    legend2---开发日志5(如何解决插件的延迟问题,比如vue) 一.总结 一句话总结:元素可以先设置为隐藏,这样就不会让用户看到延迟的问题,然后等加载完再显示, 元素先设置为隐藏 加载完再显示 ...

  4. service mysql start出错,mysql启动不了,解决mysql: unrecognized service错误

    service mysql start出错,mysql启动不了,解决mysql: unrecognized service错误的方法如下: [root@ctohome.com ~]# service ...

  5. 解决ajax的parsererror错误的终极办法(后台传给前台的数据json问题)

    解决ajax的parsererror错误的终极办法(后台传给前台的数据json问题) 出现这个问题的原因是因为后台传给前台的数据出现了问题,ajax对于json的格式特别的严格 下面是会出现这个问题的 ...

  6. 【转】怎么解决java.lang.NoClassDefFoundError错误 ,以及类的加载机制

    转自http://blog.csdn.net/jamesjxin/article/details/46606307 前言 在日常Java开发中,我们经常碰到java.lang.NoClassDefFo ...

  7. 解决IE8下opacity属性失效问题,无法隐藏元素

    解决IE8下opacity属性失效问题   由于opacity属性存在兼容性问题,所以在IE8下,用opacity来设置元素的透明度,会失效,从而导致页面的样式问题.在IE8及其更早的浏览器下,我们可 ...

  8. 【转载】重置密码解决MySQL for Linux错误 ERROR 1045 (28000): Access denied for user 'root'@'localhost' (using password: YES)

    重置密码解决MySQL for Linux错误 ERROR 1045 (28000): Access denied for user 'root'@'localhost' (using passwor ...

  9. 【mysql】service mysql start出错,mysql启动不了,解决mysql: unrecognized service错误

    service MySQL start出错,mysql启动不了,解决mysql: unrecognized service错误的方法如下: [root@ctohome.com ~]# service ...

随机推荐

  1. Scala集合库、模式匹配和样例类

    package com.yz8 import org.junit.Test class test { @Test def test: Unit = { val ints = List(1,5,7,6, ...

  2. The Department of Redundancy Department

    Write a program that will remove all duplicates from a sequence of integers and print the list of un ...

  3. P2801 教主的魔法 (分块)

    题目传送 长度为\(n(n\le 1000000)\)的数组,\(q(q\le 3000)\) 次操作.修改操作即将某个区间的值增加某个不大于1000的值,查询操作即查询某个区间比C大于等于的数有多少 ...

  4. Codeforces Round #627 (Div. 3) A - Yet Another Tetris Problem(逻辑)

    题意 : 有n个高度,可以使任一高度加二任意次,问最终n个高度可否相同. 思路: 因为添加的2x1的方块不可旋转,只需考虑所有高度是否为同一奇偶性即可. #include <bits/stdc+ ...

  5. CodeForces - 1100E 二分+拓扑排序

    题意: 一个n个节点的有向图,节点标号从1到n,存在m条单向边.每条单向边有一个权值,代表翻转其方向所需的代价.求使图变成无环图,其中翻转的最大边权值最小的方案,以及该方案翻转的最大的边权. Inpu ...

  6. Scanner用户交互

    Scanner用户交互 Scanner对象 引入语法: Scanner scanner=new Scanner(System.in);(固定的) 小写scanner为定义的名称 scanner.clo ...

  7. Redis Cluster 分布式集群(下)

    Redis Cluster 搭建(工具) 环境准备 节点 IP 端口 节点① 172.16.1.121 6379,6380 节点② 172.16.1.122 6379,6380 节点③ 172.16. ...

  8. cmder设置方法

    一.添加鼠标右键 Cmder.exe /REGISTER ALL 二.添加系统环境变量 我的电脑 > 右键属性 > 高级系统设置 > 环境变量 > 系统变量,在path中添加 ...

  9. 4.安装fluentd用于收集集群内部应用日志

    作者 微信:tangy8080 电子邮箱:914661180@qq.com 更新时间:2019-06-13 11:02:14 星期四 欢迎您订阅和分享我的订阅号,订阅号内会不定期分享一些我自己学习过程 ...

  10. leetcode31 下一个排列 字典序

    数字的字典序就是比大小 先想几个例子  123_>132  1243-> 1324 ,12453-> 12534 1.不可排的序列就是降序序列 2.两个相同长度的串比大小,前面相同, ...