我从Vue.js中的VueRouter开始,出现以下错误:
[Vue warn]: $attrs is readonly.
found in
---> <RouterLink>
<SecondNav> at resources\assets\js\modules\livegame\player\SecondNav.vue
<Player> at resources\assets\js\modules\livegame\player\Player.vue
<Root>
[Vue warn]: $listeners is readonly.
found in
---> <RouterLink>
<SecondNav> at resources\assets\js\modules\livegame\player\SecondNav.vue
<Player> at resources\assets\js\modules\livegame\player\Player.vue
<Root>
我已尽力减少一切,结果是问题仅出在路由器上。我做到了根据文档,我不知道哪里出了问题。这是我的组件:
二次导航
<template>
<div class="row second-top-nav">
<div class="col-md-offset-1 col-md-11">
<ul class="nav">
<li>
<router-link to='/public/livegame/player/history'>
History
</router-link>
</li>
</ul>
</div>
</div>
</template>
<script>
export default {}
</script>
播放器
<template>
<div>
<second-nav></second-nav>
</div>
</template>
<script>
import SecondNav from './SecondNav';
export default {
components: {
SecondNav
},
}
</script>
router.js
import Vue from 'vue';
import VueRouter from 'vue-router';
Vue.use(VueRouter);
import History from './history/History';
export default new VueRouter({
mode: 'history',
routes: [
{path: '/public/livegame/player/history', component: History, name: 'player_history'},
],
linkActiveClass: "active", // active class for non-exact links.
});
起点player.js
window.Event = new Vue();
import Vue from 'vue';
import router from './router'
import Player from './Player.vue';
let vm = new Vue({
el: '#player',
router,
components: {
Player
},
});
window.vm = vm;
我不知道问题出在哪里或我做错了什么。应用程序中的所有内容似乎都可以正常工作,但是这些通知看起来并不正确。我正在使用Vue.js版本2.5.16和VueRouter版本3.0.1。
最佳答案
具有多个Vue实例可能会导致此问题...
我修复了这个警告:Vue警告$ attrs是只读的。在发现 ...
删除行:import Vue from 'vue'
,以生成
同时保留:import VueRouter from 'vue-router'
修复原因:vue被加载了两次。 Vue导入在VueRouter的顶部。无需在VueRouter之前导入它。