vue项目hello程序的成功显示例子1(一看就懂)
2021/7/18 14:06:46
本文主要是介绍vue项目hello程序的成功显示例子1(一看就懂),对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
安装代码提示插件。 用这个插件。
写代码
2 写好代码,要加路由的啊!
复习看过去的代码。
换一个,能写的进行测试的了。
过去文件,测试3
不仅仅路由加了,app.vue里面同样要写入的! 只是这个不太会写。 。。。
终于显示出来,并全面没有报错
修改加入代码了。
1 //1 加路由 2 { 3 path:'/hello', 4 name:'hello', 5 component:()=>import('../components/hello.vue') 6 },
默认生成的代码中,加入的代码块。根组件app.vue代码
1 <!-- 加入代码 --> 2 3 4 <div id="nav"> 5 6 <router-link to="/hello">hello</router-link> 7 </div> 8 <router-view /> 9 <!-- 加入代码 -->
加入这些, 写入的组件hello,就可以显示的了。如上图所示。
这篇关于vue项目hello程序的成功显示例子1(一看就懂)的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-12-21Vue3教程:新手入门到实践应用
- 2024-12-21VueRouter4教程:从入门到实践
- 2024-12-20Vue3项目实战:从入门到上手
- 2024-12-20Vue3项目实战:新手入门教程
- 2024-12-20VueRouter4项目实战:新手入门教程
- 2024-12-20如何实现JDBC和jsp的关系?-icode9专业技术文章分享
- 2024-12-20Vue项目中实现TagsView标签栏导航的简单教程
- 2024-12-20Vue3入门教程:从零开始搭建你的第一个Vue3项目
- 2024-12-20从零开始学习vueRouter4:基础教程
- 2024-12-20Vuex4课程:新手入门到上手实战全攻略