Javascript 如何转义从laravel传递到vuejs的字符串数据

我正在建立一个新网站，我想将数据从Laravel刀片模板发送到Vue.js前端

我已经尝试将php属性传递到可以从vue访问的html属性中，这可以通过简单的字符串实现

<div id="paragraphs" originaldata="{!! $band->paragraphs !!}">
...
mounted: function() {
    this.paragraphs = this.$el.attributes.originaldata.value.split('//')
    this.paragraphs.push('')
}

...
挂载：函数（）{
this.parations=this.$el.attributes.originaldata.value.split（“/”）
本.段落.推送（“”）
}

---

这不适用于包含双引号或html标记的字符串。我曾尝试使用单引号json_编码的数据绑定到道具，但此输出中断了浏览器中的道具解析，并将html和数据分散在DOM中。

您可以挂起DOM元素中的编码数据，并在Vue组件生命周期挂钩中解码内容

// consider some arbitrary data passed from a Laravel controller containing HTML tags.
$data = '<form id="test"></form><button form="test" formaction="javascript:alert(1)">X</button>';

// echo the data within a blade layout or page element. CSRF tokens are often passed over this way.
<meta content="{{ base64_encode($data) }}" name="encoded">

// when your Vue component loads you can then access the DOM
export default {
  mounted () {
    const data = document.querySelector('meta[name="encoded"]').content

    alert(atob(data))
  }
}

<代码> /考虑从包含HTML标签的LARAVEL控制器传递的任意数据。 $data='X'； //回显刀片布局或页面元素中的数据。CSRF令牌通常以这种方式传递。 //加载Vue组件后，可以访问DOM 导出默认值{ 挂载（）{ const data=document.querySelector（'meta[name=“encoded”]”）。内容 警报（atob（数据）） } }

---

您使用的是哪种Laravel版本？