解决了,版本问题
因为根组件只能用一个标签包裹,这与VDOM的结构有关系,就是说必须要是一棵树的结构,所以根元素只能是一个标签,不能是二个并行的标签
用\src\router\index.js是一样的
把版本都查看一下,有没有问题吧
A.vue中确认下是否添加了<router-view></router-view>去挂载子路由A1.vue了呢
import Msg from './msg.js'
这里应该是msg.js, 不是msg.vue
看看Right.vue 里的手机那个GoodList的goodId是不是等于2,可能复制的时候没有更改
我的问题我自己解答,经过反复的更改,排除变量,发现是b,A1的router有问题。然后就复制了a的router,试了一下,ok了。
原因:没有注意router的代码语法规范。
import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'
import First from '@/components/First'
import A from '@/components/A'
import B from '@/components/B'
import A1 from '@/components/A1'
Vue.use(Router)
export default new Router({
routes: [
{
path: '/',
name: 'First',
component: First,
children:[
{
path: '/a',
component: A
},
{
path: '/b',
component: B
},
{
path: '/A1',
component: A1
}
]
}
]
})
版本问题 卸载@vue/cli4版本,再安装vue-cli3版本 然后重新创建项目才可以,具体命令百度下
修改msg.js内代码为
import Vue from 'vue' export default Vue 后可正常渲染页面 但是点击事件不能识别
怎么不把完整卸载命令截屏
看看控制台报错是什么,JSON里面有没有写错,或者图片文件路径
版本不匹配的问题,卸载原先版本,下载对应的版本即可,具体解决方法可以参见这个博客https://blog.csdn.net/qq_45680037/article/details/115354444
https://blog.csdn.net/qq_41196217/article/details/120695349 高版本的vue3已经弃用了事件总线,转用emitter
你用的cli版本是4吧,建议和老师保持一致
应该是vue也在调整优化中,具体是哪个文件名不重要,实质没有变
npm install router -D
vue是一套框架,用于构建用户界面的渐进式框架。vue主要是从基础知识、组件的了解、动画的过渡、可复用性和组合以及工具、模块化的管理。
vue-cli是一个基于 Vue.js进行快速开发的完整系统。主要是从搭建交互式脚手架、零配置原型开发、基于webpack构建并进行配置、插件和Preset的扩展以及图形化的创建和Vue.js项目的用户界面管理等。
vue是一整套框架,而vue-cli只是它其中的一个脚手架
看看是不是json格式写错了,我是最后多了一个逗号,结果搞半天才找出来?
卸载默认
cli npm uninstall -g @vue/cli
安装视频版中的cli
npm install -g @vue/cli@3.11.0