Vue中的文字换行问题

1、br换行可以使用v-html

<p v-html="info"></p>
data() {
   return {
     activeName: 'first',
     info: '1、优化批量上传图片<br/>2、优化时间'
   }
 },

2、\n 换行

 <p style="white-space: pre-wrap;">{{ info }}</p>
 data() {
   return {
     info: '1、优化图片\n2、优化时间\n'
   }
 },

3、把br替换成\n换行

<p style="white-space: pre-wrap;">{{changeLine(info)}}</p>
data(){
    return{
        info: '1、优化批量上传图片<br/>2、优化时间'
    }
},
methods:{
    changeLine(str){
        return str.replace(/<br>/g,'\n')
    }
}

4、el-tooltip内容换行（把\n替换成br换行）

 <el-tooltip effect="dark"=>
            <div slot="content"><span v-html="getValue()" /> </div>
              <p class="card_detail" :style="{color:'#e60012'}">银行卡照片</p>
  </el-tooltip>

  getValue() {
        let checkOption = this.checkOption.replace(/\n/g, '<br/>');
        return checkOption
    },