Vue.js 2 autoescape HTML

Question

私はLaravel 5.5でVue 2 jsを使用しています。

私はコンポーネントのデーターダウンテキストを持っています。 そして私はVUEインスタンス

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

ボディ文字列は、 '>' 記号を持っています。しかし、<にエスケープアサインを割り当てた後。

問題は次のですが、私は身体とunescpeを割り当てた後

<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> 

をHTMLに値下げをcconverts VUEのコンポーネントを、持っている、私は有効なマークダウン変換を得ることはありません。

どうすればいいですか？

何かをコンポーネントに追加しますか？ Vueインスタンスでこの文字をエスケープすることを拒否しますか？ 他に何か...喜び、助けてください。

Answer 1

サーバー側のブレードエンジンで、VueではなくHTMLをエスケープします。 {{ $lesson->body }}の代わりに{!! $lesson->body !!}を使用する必要があります。