v-html中的 ul ol 列表不显示圆点或者数字前缀问题解决

原因：开发者工具中可以看到不知哪引入（本博客情况）的列表覆盖样式代码，如下：

ol, ul {

margin: 0;

padding: 0;

list-style: none;

}

实现思路：既然被全局覆盖了，那再用自己需要的样式覆盖一次就好~

实践：

1 <div v-html="info.content" />
2 
3 ::v-deep ol {
4     list-style: disc !important;
5 }
6 
7 ::v-deep ul {
8     list-style: decimal !important;
9 }

要点：v-html 渲染的内容修改样式需要用到深度作用选择器 ::v-deep ，注意 ::v-deep 后面一定要留空格不然不起作用

拓展：/deep/ 在 vue-cli3 以上版本不起作用

参考链接：ul ol 列表前缀修改

声明：此资源由本博客收集整理，只用于记录心得和交流学习，请勿用作它途。如有侵权，请联系，删除处理。