JS-файл не может получить доступ к переменной laravel

Question

Я передаю массив из моего контроллера.

Теперь я поместил этот код в мой Laravel 6. * Blade View,

<script>
    var app = <?php echo json_encode($array); ?>;
</script>

Это прекрасно работает.

Однако, если я помещу тот же фрагмент строки (или любую из следующих строк) в свой файл app.js, это не сработает.

var app = <?php echo json_encode($array); ?>;

var app = {!! json_encode($array->toArray()) !!};

var app = '<?php echo json_encode($array); ?>';

Каждый раз, когда я получаю неверную синтаксическую ошибку.

Я не уверен, является ли это действительным заданием для StackOverflow, но я уже пробовал все другие подобные решения, и ни одно из них не работает для меня.

javascript php jquery laravel

1

Scarecrow 27 Окт 2019 в 00:04

Answer 1

Это потому, что у вас нет доступа для записи php-кода в js-файл или вы можете использовать Ajax для получения переменной php.

В своем заявлении, если вы поместите свой код в свой блейд-файл до включения файла app.js, вы сможете получить переменную app в своем js-файле. Пример:

<script>
var app = @json($array)
</script>
<script src="path to your app js file"></script>

И теперь в вашем js-файле приложения, если вы напечатаете переменную app, вы увидите результат console.log(app); в вашем файле app.js

1

Mohammed Aktaa 27 Окт 2019 в 02:03

Answer 2

Одна вещь, которую вы можете сделать, это переместить javascript в шаблон и создать маршрут к нему:

Route::get('/app.js', function () {
    $result = view('app', ['array' => [1,2,3,5,8]]);
    return Response::make($result, 200)
        ->header('Content-Type', 'application/javascript');
});

Тогда в ресурсах \ просмотрах

<script>
    var app = <?php echo json_encode($array); ?>;
</script>

Обычный способ сделать это - создать конечную точку, которая возвращает только json, а затем использовать, например, получить библиотеку api или axios на стороне клиента.

Что-то вроде этого:

Route::get('/app', function () {
    return [1,2,3,5,8];
});

<script>
    fetch(endPointUrl("/app")).then(response => {
        console.log(response);
    }).catch(error => {
        console.error(error);
    })
</script>

Где endPointUrl - это просто вспомогательная функция, которая создает полный URL-адрес.

0

Edin Omeragic 26 Окт 2019 в 21:42

JS-файл не может получить доступ к переменной laravel

2 ответа

Похожие вопросы

Новые вопросы

javascript