Как присвоить vue переменной значение переменной php?

Question

[ArtJH]

var app = new Vue({
el: '.blog',
data: {
mes : 'тут должно быть значение из php'
}
});

Comments

[Максим Тихонов]

Я обычно делаю так: в коде страницы в области заголовка вставляю скрипт вида: window.myObjectName = '<?= $var? >' ;
А потом при инициализации компонента смотрю это значение типа такого:... created() {
let myVar = window.myObjectName? window.myObjectName: 'default value' ;
}

Answer 1

[kodwi]

Крайне неправильный подход к разработке! Не мешайте теплое с мягким. Vue это чисто фронт, он должен общаться с бекендом на php только посредством API запросов. То, что вы генерируете код фронта на беке - очень устаревшей подход, писать так сейчас не нужно от слова совсем. Так фронтенд фреймворки не юзают!

Answer 2

[Roman Chuvilev]

PHP => HTML data attribute => Vue.

Answer 3

[Nikita Dergachov]

Так лучше не делать, но возможно

var app = new Vue({
el: '.blog',
data: {
mes : '<?= $var ?>'
}
});

Comments

[Konata Izumi]

Так лучше не делать.

[alex-1917]

Konata Izumi,

но возможно

[Евгений Попов]

Konata Izumi, а почему?

[Konata Izumi]

Евгений Попов, Смешение кода php и js. В идеале они должны быть отделены и общаться через api.
В данном случае получается, что перед отдачей js браузеру нужно прогонять этот код через интерпретатор php для расстановки таких вот переменных. На ровном месте создаете лишнюю зависимость.

[AlexanderKotov]

Konata Izumi, либо я что-то не понимаю в этом мире, либо Вы.
PHP код обрабатывается на сервере, который отдаёт в браузер уже готовый к обработке код. Таким образом, браузер никак не участвует в обработке PHP кода.
А не нужно так делать хотя бы по той причине, что такой JS код уже не получится вынести в отдельный js файл.

[Konata Izumi]

AlexanderKotov,

браузер никак не участвует в обработке PHP кода.

Я нигде не утверждал, что браузер обрабатывает php, а лишь подчеркнул небоходимость обработки такого кода интерпретатором php (который на веб сервере в данном случае).

PHP код обрабатывается на сервере

Ок. Но причем тут тогда js код?
Или для вас писать js с вкраплениями php это норма?

Я рассматриваю ситуацию, когда бек и фронт изолированы друг от друга. Php не знает, что там в js творится, и аналогично js не знает про php. Общаются оба через api.

[Максим Тихонов]

Обычно приложение собирается до выгрузки на сервер и вставить такой код не представляется возможным в большинстве случаев

[I_GRIN_I]

AlexanderKotov, вообще, получится - ob_get_content

[I_GRIN_I]

Konata Izumi, а зачем делать лишние апи запросы для получения 1-2 переменных, если их можно вывести при первой загрузке страницы сразу в жс?

[I_GRIN_I]

Помоему пхп на то и препроцессор, чтобы вот в таких местах вставлять данные

[Konata Izumi]

I_GRIN_I, Чтобы держать фронт чистым. От одного лишнего запроса для инициализации не умрете.

[Konata Izumi]

I_GRIN_I, вы бы согласились поддерживать мешанину из php и js кода?
Это пока здесь одна переменная. Потом будет как здесь: Как отобразить PHP данные в vue component?
А дальше только хуже.

[I_GRIN_I]

Konata Izumi, а от пары десятков можно и присесть. Да согласился бы. Просто это можно сделать намного красивее, компактнее и понятней, чем в приведенном Вами примере. Как по мне это намного более наглядно, чем переменные из запросов

Answer 4

[Евгений]

Недавно была такая же задача, на WordPress прикрутил Vue. Чтобы передать переменную из php я использовал функцию wp_localize_script если вкратце то оно выведет что-то похожее

<script type='text/javascript'>
/* <![CDATA[ */
var object_name = {"some_string":"Some string to translate","a_value":"10"};
/* ]]> *//code>

В соседней ветке рекомендуют так выводить на странице
<code lang="php">
echo sprintf("<script>var json_data = '%s';</script>", json_encode($arr));
</code>