Конфликт по шаблону Twig и Vue.js

Я делаю программу с использованием Slim 2, которая использует Twig в качестве моего движка шаблонов. поэтому использует синтаксис{{ foo }} в php файле. С другой стороны, я использую vue.js, он также использует{{ bar }}.

Например.

Я собираюсь сделать двустороннее связывание, ниже мой HTML-код.

<div class="container">
    Label Value: <label>{{ foo }}</label><br>
    Field Value: <input v-model="foo">
</div>

и вот мой код vue js.

new Vue({

    el: '.container',
    data: {
        foo: 'Hello world.'
    }
});

Таким образом, мир Hello должен быть в значении метки.

На выходе изображение ниже.

Что это не сработало, вероятно, система думала, что это переменная ветки. Поэтому я проверил, передав переменную в представлении.

$app->get('/', function() use ($app) {
    $app->render('login.php', [
        'foo' => 'FROM PHP FILE'
    ]);
})->name('login');

Итак, я проверил, значение метки: показывает переменную, которую я передал из файла PHP, а не из кода VUE.

Трудно объяснить, но вы поняли. Интересно, как обойти шаблон веточки и использовать{{ }} из Vue также.

Ответы на вопрос(10)

Ваш ответ на вопрос