后端返数据替换样式

要求上图这样的样式

后端返的数据：

"第一个 是否替换：是 \n\r 第二个 是否替换：否"

根据 \n\r切割成数组

数组中每个元素遍历，

如果存在是否替换：是，则替换成<span style="color:red"></span>

如果存在是否替换：否，则替换成<span style="color:green"></span>

拼接成字符串

页面上用v-html渲染

 if (row.remark) {
        // console.log(row.remark, "----re");
        let remarkarr = row.remark.split("\n\r");
        // console.log(remarkarr, "remarkkk");
        let newarr = [];
        remarkarr.forEach((v) => {
          // console.log(v, "-----v");
          if (v.indexOf("是否标准：否") != -1) {
            // console.log('-----ok1')
            v = v.replace(
              "是否标准：否",
              "<span style='color:#F24040;fontWeight:600'>是否标准：否</span>"
            );
            // console.log(v,'----oooov')
            newarr.push(v)
          }
          if (v.indexOf("是否标准：是") != -1) {
            // console.log('-----ok2')

            v = v.replace(
              "是否标准：是",
              "<span style='color:#F24040;fontWeight:600'>是否标准：是</span>"
            );
              newarr.push(v)
          }
        });
        // console.log(remarkarr,  newarr,'--------remarkarr')
        let newremarkstr = newarr.join('<br/>')
        this.remark = newremarkstr
       
      }

另一种简单的办法：后端返回的数据中是带html标签的数据

"<span style='color:red'>是否标准：是</span>"