一、含换行的文本回显问题
(1)使用正则表达式+v-html即可实现;
![6a787d4199c9514606ff66253f3aa8bf.png](https://i-blog.csdnimg.cn/blog_migrate/837610ce7d29db65b818e50bca77346e.png)
replace
![5376196a4494c0b87de9f8210ff89af4.png](https://i-blog.csdnimg.cn/blog_migrate/eb3286cc50cf9412118ee409461c93c5.png)
(2)使用纯CSS即可实现(多少有些错位的问题,建议第一种);
.
![ec93ca9882b67efd2830579b768e6fc0.png](https://i-blog.csdnimg.cn/blog_migrate/71782281d74af1f041e8055984b7094a.png)
(3)直接在textarea标签中亦可实现,只不过牵扯到IE浏览器的时候还是多多少少看着有些差异。
二、vue中对同一个标签同时使用innerHTML和vue中v-model、{{}}等
项目中出现了相关的需求,结果前端同事是这么处理的,很有问题,现提供一下方法:
(1)用v-html进行数据渲染;
(2)单纯使用innerHTML(不建议),但不要混合使用,否则在IE浏览器倒是卡死,不信邪的朋友可以试试。
第二种方式在谷歌浏览器没问题,但是万恶的IE浏览器就不行了,IE浏览器是默认开启严格模式(use strict)的,怀疑是因为这个,当然,也有可能是兼容性问题(猜测,待分析)。
三、sessionStorage的坑
(1)只在当前窗口及其子窗口(例如:通过window.open()打开的窗口)共享,在新的标签页即使访问同源地址也是无法共享的;
(2)IE中把sessionStorage的值清空
![f86b8e087456b00d105bc3d2fb85c0d6.png](https://i-blog.csdnimg.cn/blog_migrate/e90b88a18ba8bd21316f4b522baf09ea.png)
归根结底,还是因为IE自动关闭了标签页,导致sessionStorage中的值销毁,sessionStorage生命周期为当前窗口或标签页,一旦窗口或标签页被永久关闭了,那么所有通过sessionStorage存储的数据也就被清空了。
为了规避这个问题,可以使用localStorage、cookie等进行数据持久化存储。
四、360浏览器兼容/极速切换时浏览器存储问题
如果在浏览器存储有数据的时候(类似于sessionStorage),切换浏览器模式需要重新存储一遍。