Vue.js 2 autoescape HTML

我在Laravel 5.5中使用了Vue 2 js。Vue.js 2 autoescape HTML

我有一个组件数据 - 降价文本。我有一个VUE实例

new Vue({ 
     el : '#lesson_edit', 
     data : { 
      lesson : { 
       body : `{{ $lesson->body }}` 
      } 
     } 
    });

体中的字符串有一个 '>' 符号。但分配ot逃脱<后。

的问题是下一个，我有一个VUE组件，它cconverts降价到HTML

<template> 
     <div v-html="parsedBody"></div> 
    </template> 


<script> 

    export default { 
     props : ['body'], 
     mounted() { 
      console.log('Component mounted.') 
     }, 
     computed : { 
      parsedBody(){ 
       return marked(this.body, { sanitize: true }) 
      } 
     } 
    } 
</script>

分配的身体和unescpe后，我没有得到一个有效的降价转换。

我该怎么办？

添加事件到组件？拒绝这个字符在Vue实例中转义？还是别的...恳求，帮助。

来源

2017-09-20 Denys Siebov

是从'>'转换为'<'之前它分配给vue或之后发生？另外，你有没有尝试{！ !!}而不是{{}}来显示原始字符串而不是转义字符串？ –

它是服务器端的叶片引擎，它转义html而不是Vue。您将不得不使用{!! $lesson->body !!}而不是{{ $lesson->body }}。

来源

2017-09-20 18:50:56

yeap。它有助于。 –

如果此解决方案有效，您可以接受此答案。 –

Vue.js 2 autoescape HTML

回答

相关问题