Javascript – Vue konvertiert String in HTML
为情所困
为情所困 2017-05-19 10:31:46
0
5
799
let str = "<img :src=('face[k].src)>"
this.commentList[i].Content = this.commentList[i].Content.replace(sArr[j], str)

Die Anforderung besteht darin, die Zeichenfolge in str für die Ausgabe zu konvertieren. Überprüfen Sie, ob der zurückgegebene Inhalt ein Emoticon enthält, und ersetzen Sie es dann. Wie konvertiere ich es in HTML? Es scheint, dass die Methode eval() nicht unterstützt wird

为情所困
为情所困

Antworte allen(5)
phpcn_u1582

如下,应该在获取到数据之后修正 Content 为 html, 并使用 v-html 指令绑定:

<template>
    <ul v-for="item in commentList">
        <li>
            <p v-html='item.Content'></p>
        </li>
    </ul>
</template>

<script>
    export {
        data() {
            return {
                commentList: []
            }
        },
        created() {
            this.$http.get('api/get-commentlist?article_id=1').then((res) => {
                res = res.body
                res.list.forEach((item, i) => {
                    // sdfsafs[face-1]sad[face-2] 
                    // 将被替换为 
                    // sdfsafs<img src="face-1.jpg">sad<img src="face-2.jpg">
                    // ,请自行根据需要修改
                    item.Content = item.Content.replace(/\[face\-(\d+)\]/g, '<img src="face-$1.jpg">')
                })
                this.commentList = res.list
            })
        }
    }
</script>

--- 补充 ---

其中 .replace() 方法的第二个参数也支持使用函数返回,即能实现更复杂的替换,如:

item.Content = item.Content.replace(/\[(.+)\]/g, function(word, $1){
  return '<img src="/static/img/'+ this.face[$1].src +'" />'
})
Peter_Zhu

建议使用v-if更好点

迷茫

原生的用innerHTML,jq用html();

大家讲道理

没有人遇到同样的问题吗~

Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!