Как передать переменную JS в экземпляр Vue - PullRequest
Новая
       6

Как передать переменную JS в экземпляр Vue

0 голосов
/ 28 марта 2019

В моем шаблоне лезвия Laravel у меня есть фрагмент JavaScript, который создает переменную, которая содержит индекс (с именем nextIndex) для массива. Я хотел бы использовать этот индекс в экземпляре Vue, например так: 

var app = new Vue({
    el: '#root',
    data: {
        url: "{{route('showphoto')}}/{{$photos[nextIndex]->id}}"
    }
});

Я часами искал в интернете и читал документацию, но, возможно, я смотрю не на те места. Как я могу передать переменную JS nextIndex в данные vue выше?

EDITED Я также попробовал это так (с @ before nextIndex и созданием целого URL вне экземпляра Vue: 

var key = {{ $photo->id}};
var photos = {!!$photos!!};
var @nextIndex = 0;
for (i = 0; i < photos.length; i++) {
    if(photos[i]['id'] === key && !(i >= photos.length-1)){
        @nextIndex = i+1; // if not the last index, give me the next index
        break;
    } else if(photos[i]['id'] === key && (i == photos.length-1)) {
        @nextIndex = 0; //if this is the last index, give me the first one
        break;
    }
 }

 var url = "{{ route('showphoto') }}/{{ $photos[@nextIndex]->id }}";

var app = new Vue({
    el: '#root',
    data: {
        url: url
    }
});

Это дает мне точно такое же сообщение об ошибке: 

Undefined index: nextIndex
...