将前端vue获取和传递后端spring boot数据

我这里引用的是element UI框架,在这个里面的数据流动需要一下几个文件夹,也就是需要我们经常改动的地方。

下面以此介绍:

1.app.vue:最下面的app.vue是运行vue的主文件,例如在hbuider中直接运行这个文件就可以把前端跑起来

2.api文件夹:通过名字可以猜个差不多,api叫接口。他相当于桥梁,(在参数处)接收前端vue数据,(通过url)找到后端Controller,后端再把查询出的结果返回回来,最后return返回给vue。

文件夹中存放的是js文件,每个js文件都是连接后端(spring boot)的接口,如图1:  url:根据路径去controller里面找,具体后端controller怎么写能让他找到,一会儿会说。 method:就是get post 传递方式,具体区别可以去百度一下,,这里面要不就是get 要不就是post 。params:是传递的参数把vue给自己的参数传递给后端Controller。基本上是一个vue文件对应一个js文件,一个js文件里面有增删改查几种方法。

——>js文件 :

——>vue文件:

3.router文件夹:英文翻译叫轨迹,其中有一个index.js文件夹,此文件的作用是路径。把每一个vue文件写在这里,这样程序就知道你写的vue页面时放在哪的。

4.views文件夹:叫视图,这里面放的就是我们总改动的也是显示在界面的页面,起到的作用就像html似的。

主页显示:里面跟html似的,由标签组成界面想要显示的样子;css:和传统的css一样;js:和传统的js一样

转自:https://www.cnblogs.com/zxrxzw/p/11304289.html

  • 1
    点赞
  • 27
    收藏
    觉得还不错? 一键收藏
  • 6
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值