Question

我有一个JSON文件，输出以下样式：

{
"h1" : {
    "font-family" : "Lato",
    "font-size" : "24px",
    "line-height" : "28px",
    "font-weight" : 600,
    "colorId" : 3,
    "margin-bottom" : "10px",
    "margin-top" : "20px"
},
"h2" : {
    "font-family" : "Lato",
    "font-size" : "20px",
    "line-height" : "24px",
    "font-weight" : 600,
    "colorId" : 3,
    "margin-bottom" : "10px",
    "margin-top" : "20px"
}

}

我想使用第一个键“ h1，h2，...”作为HTML标记来显示它。 Vue有可能吗？

应该是这样的：

<div v-for="(props, tag) in headers">
    <{{ tag }}>x</ {{ tag }}>
</div>

Answer 1

<div v-for="(props, tag) in headers" v-html="`<${tag}>x</${tag}>`"></div>

将JSON值用作带有vue的HTML标签

1 个答案: