Блог

Главная - Вопросы по программированию - Переменная Laravel Vue

Переменная Laravel Vue

#laravel #vue.js

#laravel #vue.js

Вопрос:

У меня возникли проблемы с пониманием того, как комбинировать переменные Vue с шаблонами блейда в Laravel.

Это работает:

 <ul id="media" v-if="files !== null">
    <li v-for="item in files">
        @{{ item.file }}
    </li>
</ul>

Это не работает:

 <ul id="media" v-if="files !== null">
    <li v-for="item in files">
        <img src="{{ url('/storage') }}@{{ item.file }}">
    </li>
</ul>

Как я могу объединить шаблоны блейда с Vue?

Комментарии:

1. Являются ли эти компоненты Vue однофайловыми или как вы используете их на странице? Мне нужно немного больше контекста (больше кода) из представлений и, возможно, javascript (та часть, где вы делаете new Vue() )

2. Я использую ее в обычном шаблоне блейда, а не как компонент. Переменная в vue установлена правильно, и все работает. Проблема в том, что переменная @{{ item. файл }} больше не переводится, если я использую его в части img html.

Ответ №1:

Только что сам нашел решение — его нужно использовать таким образом:

 <img :src="'storage/'   item.file">

Ответ №2:

Вы должны v-привязать объекты данных vue к атрибутам html.