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： 偶爾記錄一下