vue脚手架的安装和配置
1. npm install-g @vue/cli
2. 测试版本号 vue -V @vue/cli 5.0.4
3. vue create app2,创建一个vue项目
项目完毕之后
1. index.html，这个是首页的地址，这个地址呢？访问的地方
核心内容：<div id="app"></div>
2. main.js
我们在之前第一个案例的时候，有html5的定义，定义完毕之后，有script,针对div#app的渲染。现在这个渲染放在了main.js里面，通过框架来实现一个html、js的分离操作，使页面更加简单，逻辑更加清晰。
| import Vue from 'vue' 相当于之前的script src=’vue.js’ import App from './App.vue' 引用组件？都有啥呢？？？ import router from './router' 引用一个路由配置 Vue.config.productionTip = false 暂时不用管 new Vue({ router, render: h => h(App) }).$mount('#app')； //这个还是之前的绑定操作 |
3. 去看组件
App.vue组件
| <template> 组件的定义 <div id="app"> <nav> 导航标签 下面的定义是路由链接设置,router-link,Home,About的定义从router下的index.js来找到定义。 <router-link to="/">Home</router-link> | <router-link to="/about">About</router-link> </nav> <router-view/> </div> </template> |
| |
4. 需要去看router下的index.js
5. 去看views下的AboutView.vue，HomeView.vue设置
- 点赞
- 收藏
- 关注作者
评论（0）