Laravel 前后台共享数据

简介: 在视图模板中初始化JS变量。 var app = ;5.5以后可以这么写, 用 @json Blade 指令替代手动 json_encode var app = @json($array);曾经在多语言项目中这么用过。
在视图模板中初始化JS变量。
<script>
    var app = <?php echo json_encode($array); ?>;
</script>

5.5以后可以这么写, 用 @json Blade 指令替代手动 json_encode

<script>
    var app = @json($array);
</script>

曾经在多语言项目中这么用过。

<script>
    window.Laravel = {
        csrfToken: '{{ csrf_token() }}',
        Locale: '<?php echo \App::getLocale(); ?>',
        Languages: <?php echo json_encode(
            [
                'scaffold'         => __('scaffold::t'),
                'module_dashboard' => __('module_dashboard::t'),
                'module_user' => __('module_user::t'),
                'setting' => __('setting::t'),
            ],
            JSON_PRETTY_PRINT | JSON_UNESCAPED_UNICODE);?>
    };
</script>
Laravel变量传入在vue组件中

定义组件

<script>
export default {
    props: ['surveyData'],
    mounted () {
        // Do something useful with the data in the template
        console.dir(this.surveyData)
    }
}
</script>

注入变量

<survey-component :survey-data="'{!! json_encode($surveyData) !!}'"></survey-component>

参考:
https://medium.com/@m_ramsden/passing-data-from-laravel-to-vue-98b9d2a4bd23
https://laravel-china.org/docs/laravel/5.6/blade/1375

相关文章
|
8月前
|
前端开发 API 开发者
Javaweb之前后台分离开发介绍的详细解析
2.1 前后台分离开发介绍 在之前的课程中,我们介绍过,前端开发有2种方式:前后台混合开发和前后台分离开发。 前后台混合开发,顾名思义就是前台后台代码混在一起开发,如下图所示:
108 0
|
5月前
|
开发者 Python
揭秘Django信号的神奇之处:如何解锁异步处理与插件化的秘密武器?
【8月更文挑战第31天】在现代Web开发中,Django信号作为一种强大的机制,支持异步处理与插件化扩展,使开发者能够在不改动现有代码的情况下,在关键事件点插入自定义逻辑。本文详细介绍了Django信号的概念、基本用法及其在异步任务处理与插件开发中的具体应用,展示了如何利用信号监听模型变化并触发相应操作,从而提升应用性能与灵活性,预示着信号机制在未来Web开发中的重要潜力。
31 0
|
8月前
|
JavaScript Java API
基于代理和单例模式的 electron 多窗口管理方案
基于代理和单例模式的 electron 多窗口管理方案
596 0
|
6月前
|
SQL 前端开发 API
Laravel框架的主要优点是什么?
【7月更文挑战第2天】Laravel框架的主要优点是什么?
118 0
|
前端开发
前端学习笔记202307学习笔记第五十九天-react源码-创建任务并存放在任务队列4
前端学习笔记202307学习笔记第五十九天-react源码-创建任务并存放在任务队列4
69 0
|
前端开发 搜索推荐 JavaScript
什么是服务端渲染?前后端分离的优点和缺点?
什么是服务端渲染?前后端分离的优点和缺点?
252 0
|
前端开发
前端学习笔记202307学习笔记第五十九天-react源码-创建任务并存放在任务队列2
前端学习笔记202307学习笔记第五十九天-react源码-创建任务并存放在任务队列2
51 0
|
前端开发
前端学习笔记202307学习笔记第五十九天-react源码-创建任务并存放在任务队列3
前端学习笔记202307学习笔记第五十九天-react源码-创建任务并存放在任务队列3
45 0
|
前端开发
前端学习笔记202307学习笔记第五十九天-react源码-创建任务并存放在任务队列1
前端学习笔记202307学习笔记第五十九天-react源码-创建任务并存放在任务队列1
76 0
|
JavaScript 前端开发
前端如何实现模块化开发?
在网页开发的早期,JavaScript 制作作为一种脚本语言,做一些简单的表单验证或动画实现等,那个时候的代码还是很少的。
184 0