vue路由器组件变量未定义答案

【问题标题】：vue router component variable undefinedvue路由器组件变量未定义
【发布时间】：2019-02-05 06:13:45
【问题描述】：

你好，我在我的 php 页面内容选项卡中使用路由器，当我第一次输入未定义的路由变量并更改路由返回时它可以工作，当我从 url 输入与未定义的变量显示在 vue dev 扩展中相同时？

app.js

const routes = [
  {
    path: '/',
    component: infotab,
    name: 'Info'
  },
  { path: '/characters', component: charactertab, name: 'home' },
  { path: '/watch', component: watchtab },
  { path: '/downloads', component: downloadtab }
]

const router = new VueRouter({
  routes,
});

var tabb = new Vue({
 router,
 el: "#app",
}).$mount('#app');

模板脚本

<script>
export default {
  data () {
    return {
      details: window.infos,
      characters: window.characters,
      episodes: window.episodes,
    }
  }
}
</script>

single.blade.php

              <div data-v-20e267b2="" data-v-aaf71b06="" class="overview">
                <router-view></router-view>
              </div>
           </div>
<script>
window.infos = {!! json_encode($response) !!};
window.characters = {!! json_encode($apicharacters) !!};
window.episodes = {!! json_encode($episodes) !!};
</script>

【问题讨论】：

标签： javascript php laravel vue.js vue-component

【解决方案1】：

未定义，因为 window 对象的属性未设置。

相反，您可以移动

<script>
window.infos = {!! json_encode($response) !!};
window.characters = {!! json_encode($apicharacters) !!};
window.episodes = {!! json_encode($episodes) !!};
</script>

所以它在 HTML <head> 中。这将在 Vue 启动之前设置属性和值。

【讨论】：