vue.js - 使用 vue 2、路由器和 vue-loader 进行引导

标签 vue.js vuejs2 vue-router vue-loader

对于 vuejs 1,代码是:

const App = Vue.extend(Index);
router.start(App, '#app');

Index 是一个组件。

我尝试像这样将它转换为 vue 2:

const App = Vue.extend(Index);
const app = new App(router).$mount('#app');

但这给出了一个[Vue warn]: Error when rendering root instance

重写这个的正确方法是什么?

谢谢

最佳答案

你必须给路由器作为参数:

const app = new App({ router }).$mount('#app');

例子:

const Index = {
  template: `<div id="app">It's working!</div>`
}
const App = Vue.extend(Index)
const router = new VueRouter()

const app = new App({ router }).$mount('#app');
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>
<div id="app"></div>

关于vue.js - 使用 vue 2、路由器和 vue-loader 进行引导,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39854429/

相关文章:

javascript - 使用 Vue 3 从子组件更改父组件的引用

javascript - 绑定(bind)样式使整个页面跳跃(滚动)

javascript - 如何将 SCSS 编译为 CSS 并将 CSS 代码作为字符串加载到变量中?

javascript - 如何重构数据对象以允许其内部的计算属性

javascript - Vue Material - 路由器 View 上的原生转换

vue.js - Vue/Nuxt - 安装 : () => Vs mounted: function()

javascript - Vuex 状态属性设置为响应 GET 请求。函数给出错误,因为所述属性显然为 NULL

vue.js - 使用 Vue 测试工具全局模拟数据

vuejs2 - 来自路由器参数的无效 Prop 类型,预期数字得到字符串

subdomain - Vue.js:vue-router 子域