vue的v-html遇到的&nbsp；奇怪问题_v-html nbsp-优快云博客

文章讲述了在使用v-html渲染带样式HTML时遇到的问题，即Chrome和Edge浏览器将160字符解析为&nbps;导致样式失效。作者通过检查和调试发现是字符编码问题，并通过循环替换160字符为普通空格解决了问题。

我的v-html是一段带有style样式的html代码，我发现我写的代码在火狐浏览器是正常的，但是在chrome和Edge里面都不正常。

传入的html是这样的：

<div style="background:red">
    红色背景
</div>

然后检查代码，发现不能正常显示的浏览器：

也就是它把<div style="background:red">认定为一个标签，这真是奇了怪。然后我点击编辑html，发现是这样的：

然后我检查传进去的html，发现并没有 

怒了，遍历传进去的html，逐个检查空格到底是啥：

  for (let k = 0; k < this.html.length; k++) {

          let curChar = this.html.charAt(k);

          console.log(curChar+":"+curChar.charCodeAt(0));

 }

发现空格都是160，然后意思是谷歌和微软浏览器把160字符又解释成  ,就这问题整了我好几个小时，人家火狐就不会啊。

最后也不知道怎么用正则表达式替换了这个160字符了，单个写知道是String.fromCharCode(160),那就干脆循环换掉吧。

于是就这样：

        let temp="";
        for (let k = 0; k < txt.length; k++) {
          let curChar = txt.charAt(k);
          if (curChar.charCodeAt(0) == 160) {
            temp += " ";
          } else {
            temp += curChar;
          }
        }
        this.html=txt;

然后就显示正常了：