javascript - Vue.js 2 自动转义 HTML

标签 javascript laravel-5 vuejs2 markdown laravel-5.5

我在 Laravel 5.5 中使用 Vue 2 js。

我有一个组件数据 - Markdown 文本。 我有一个 vue 实例

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

正文字符串有一个“>”符号。但是在将 ot 转义到 < 之后。

下一个问题,我有一个vue组件,可以将markdown转换成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>

分配 body 和 unescpe 后,我没有得到有效的 Markdown 转换。

我该怎么办?

向组件添加一些东西? 拒绝在 Vue 实例中转义这个字符? 或其他...请帮助。

最佳答案

转义html的是服务端的blade引擎,不是Vue。您将不得不使用 {!! $lesson->body !!} 而不是 {{ $lesson->body }}

关于javascript - Vue.js 2 自动转义 HTML,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46325384/

相关文章:

javascript - 如何在 Rails 4 中利用浏览器缓存?

javascript - 在 SuiteScript 中提取 JSON 数据时出现问题 - NetSuite

javascript - 谷歌地图标记不显示

javascript - 如何添加函数中存在的所有参数?

php - 验证一个字段 mysql laravel 5

php - 如何创建Laravel 5.1自定义身份验证驱动程序?

php - 在 laravel 5.4 中如何编写这个 sql 查询?

Symfony 4、Twig 和 VueJS - 重定向到 Vue 组件中的 Symfony 路由

javascript - Vue 与 VCalendar 组件 : Keep data in sync with another Vue instance

javascript - vue.js、vue-router 和参数/属性