vue项目中，写JSX自定义语句时，实现v-for的方法

一、遇到的情况

创建地图自定义内容，只能用JSX语句，但JSX语句不支持vue中的v-for写法，识别不了

 

二、解决方法

使用map方法，返回定义的字符串标签，需要加上join方法

原因：

　　/*

      jsx语句不支持v-for，用map方法代替，但是会有逗号返回，原因是利用map插入到DOM时

      调用了toString方法，把数组里的逗号也带上了，所以要调用join方法

    */

        

const content = `
           <div>${param.data.map(item => {
    　　　　var str = '<span>' + item.resule + '</span>'
   　　　　 return str
  　　　　　}).join('')}</div>`
      　　/* 如果要直接写成下面这样，是无效的
　　　　　　　　return <span>${item.resule}</span>    
　　　　　　*/

注: param.data是数组元素

// 返回的标签就是
<div>
    <span>数组里的内容</span>
    <span>数组里的内容</span>
    <span>数组里的内容</span>
    <span>数组里的内容</span>
</div>

 

        `ps： 偶尔记录一下