显示来自JSON内的内容

Question

我是html，javascript和vue的新手。我不确定这是否具体vue或可以使用一些JavaScript魔术来解决。

我有基于NodeJS的服务，有用VueJS编写的用户界面。该页面的内容来自一个markdown编辑器，nodejs使用showdown将其转换为html。从的NodeJS的响应是JSON和我试图使用Vue的显示它的屏幕像下面

app.js (vue) 

new Vue({ 
    el: "#mdEditor", 

    data: { 
     content: '', 
    }, 
    mounted: function() { 
    this.defaultPage(); 
    }, 

    methods: { 
    defaultPage: function() { 
     this.$http.get('/defaultPage') 
     .then((result) => { 
      this.$set(this, 'content', result.data.html); 
      console.log('result=', result); 
     }, (err) => { 
      console.log('error=', err); 
     }); 
    } 
} 
}); 

HTML文件

<div class="container" id="mdEditor"> 
<div class="col-sm-12"> 
    <div class="panel panel-primary"> 
    <div class="panel-body"> 
     {{content}} 
    <!-- content of the md file goes here--> 
    </div> 
    </div> 
</div> 

但是内容（即HTML代码）打印为文本而不是html。 感谢您的帮助提前

Answer 1

使用v-html属性来呈现原始html。详情请参阅docs here。

重要的是要注意，像这样插入原始html可能是一个安全漏洞（请参阅文档中的注释）。