Where is the error in array formation, js vue?

Question

Vue.js

Tell me where the error is, in the formation of the array, or the encoding, or something else!?

I form an array like this, YouTube api is used ..

for(i=0; i<pageLen; i++){
    title2 += '{titles:"'+data.items[i].snippet.title+'", vid_id:"'+data.items[i].snippet.resourceId.videoId+'"}, ';
}
var arr_vid_all = title2.split(', ').reverse();  //  это vid3

this is what {{vid3}} array in html produces https://yadi.sk/d/tSHXlR5C9wGX7g escaped array, like valid json.

As a result, the data does not display, although the tags are filled in, but they are empty.

<ul>
        <li v-for="item in vid3">
        <p> {{item.titles}}</p>
            <p> {{item.vid_id}}</p></li>
    </ul>

if you make such an array vid2, then everything is clearly displayed, vue automatically:

new Vue({
        el: '#appvue', 
        data: {
          vidid: arr_vid_id,
          vidtitle: arr_vid_title,
          selected: 'Серия 1', 
          vid2: [
            { titles : "Три кота | Заморские гости | Серия 111 | Мультфильмы для детей",  vid_id : " dN_Km7zyDVo" },
             { titles : "Три кота | Котята спешат на помощь | Серия 110 | Мультфильмы для детей",  vid_id : " UspZWBnxcXw" },
              { titles : "Три кота | Экскурсия | Серия 109 | Мультфильмы для детей",  vid_id : " vEtDzEkEZ4Y" },
               { titles : "Три кота | Лабиринт | Серия 108 | Мультфильмы для детей",  vid_id : " FtyYYYZ9Ga4" },
              { titles : "Три кота | В гостях у Горчицы | Серия 107 | Мультфильмы для детей",  vid_id : " tjLREaK5llc" },
               { titles : "Три кота | Сюрприз для мамы | Серия 106 | Мультфильмы для детей",  vid_id : " eG8X_J_B6Ic" },
                { titles : "Три кота | Снежный домик | Серия 105 | Мультфильмы для детей",  vid_id : " 4wfWrRgBTm4" },
          ],
          vid3: arr_vid_all,
        },

Answer 1

So you get an array of strings, and you try to fill from objects.

const title2 = []
for (let i = 0; i < data.items.length; i++) {
  title2.push({
    titles: data.items[i].snippet.title,
    vid_id: data.items[i].snippet.resourceId.videoId
  })
}
var arr_vid_all = title2.reverse()