Здравствуй, Тостер!
Есть код на Vue + rails через webpacker, не работает vue. Вот сам код:
import Vue from 'vue'
import TurbolinksAdapter from "vue-turbolinks"
import VueResource from "vue-resource"
Vue.use(VueResource);
document.addEventListener('turbolinks:load', () => {
Vue.http.headers.common["X-CSRF-Token"] = document.querySelector('meta[name="csrf-token"]').getAttribute("content");
var element = document.getElementById("team-form")
if(element != null){
var team = JSON.parse(element.dataset.team);
var players_attributes = JSON.parse(element.dataset.playersAttributes);
players_attributes.forEach(function(player){
player._destroy = null
})
team.players_attributes = players_attributes;
var app = new Vue({
el: element,
mixins: [TurbolinksAdapter],
data: function(){
return{
team: team
}
},
methods: {
addPlayer: function(){
team.players_attributes.push({
id: null,
name: "",
_destroy: null
})
}
}
});
}
})
Код шаблона:
<%=content_tag :div,
id: "team-form",
data: {
team: team.to_json(except: [:created_at, :updated_at]),
players_attributes: team.players.to_json(except: [:team_id, :created_at, :updated_at])
} do %>
<label>Team name</label>
<input type="text" v-model="team.name" />
<h4> Players </h4>
<div v-for="(player, index) in team.players_attributes">
{{ index }}
</div>
<button v-on:click="addPlayer" > Add player </button>
<% end %>
Сообщение об ошибке в консоле браузера (хром):
Uncaught TypeError: Cannot read property 'props' of undefined
at normalizeProps (vue.runtime.esm.js?ff9b:1291)
at mergeOptions (vue.runtime.esm.js?ff9b:1363)
at mergeOptions (vue.runtime.esm.js?ff9b:1372)
at Vue$3.Vue._init (vue.runtime.esm.js?ff9b:4268)
at new Vue$3 (vue.runtime.esm.js?ff9b:4384)
at HTMLDocument.eval (hello_vue.js?94ab:29) <b>!!!! это и есть наш первый файл</b>
at Object.t.dispatch (turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:6)
at r.t.Controller.r.notifyApplicationAfterPageLoad (turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:7)
at r.t.Controller.r.pageLoaded (turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:6)
at turbolinks.self-1d1fddf91adc38ac2045c51f0a3e05ca97d07d24d15a4dcbf705009106489e69.js?body=1:6