Element UI表单中数据是字符串并含有多个内容并存时，如何进行换行展示

Element UI表单中数据是字符串并含有多个内容并存时，如何进行换行展示

 <!-- 方法一：将字符串转化为数组，在进行循环 -->
      <!-- <el-table-column label="平均召回数量" prop="recallGoodsNums" align="center">
        <template slot-scope="scope">
          <div style="text-align:center" v-for="(item,index) in scope.row.recallGoodsNums" :key="index">{{item}}</div>
        </template>
      </el-table-column> -->
      <!-- 方法二：使用v-html -->
       <el-table-column label="平均召回数量" prop="recallGoodsNums" align="center">
        <template slot-scope="scope">
          <span v-html="scope.row.recallGoodsNums"></span>
        </template>
      </el-table-column>

 search () {
      this.listLoading = true
      userApi.hot(this.queryParam).then(data => {
        const re = data.response
        this.tableData = re.list
        this.total = re.total
        this.queryParam.pageIndex = re.pageNum
        this.listLoading = false
        // 方法一：
        // this.tableData.forEach((value,index) => {
        //   console.log('value.recallGoodsNums',value.recallGoodsNums)
        //   try{
        //     value.recallGoodsNums = value.recallGoodsNums.split(',')
        //   }catch{err => {
        //     console.log('err',err)
        //   }}
        // })
        console.log('this.tableData',this.tableData)

        // 方法二：
        this.tableData.map((value,index) => {
          if(value.recallGoodsNums != null){
            value.recallGoodsNums = value.recallGoodsNums.replace(/\,/g,'<br/>')
            console.log(value.recallGoodsNums);
          }
        })
      })
    },