打印出后台从数据库中查询出的数据，发现字段是完整的，并无缺失；打印JSON字符串，发现缺少字段，定位到问题入口；查看JSONtoJSONString()方法后，并未发现异常；将该模块的所有文件重新审阅一遍后发现，实体类Userjava中有个布尔类型的成员变量的get方法不对头；这就导致JSON将User对象转换成json字符串时，无法通过反射获取到其state字段，最终给前端的json数据也就没有该字段。
处理方法，重写实体类User的get、set方法并检验，确保不再出错。重启后，测试显示正常。查看后台支持的编码格式和前端axios发送过去的的编码格式是否一致。不一致就会出现跨域问题。至于为什么也不明白，可能是浏览器认为不一致的编码就是跨域也可能就是浏览器的bug。Vue请求后端数据的方法，首先在api文件夹下，建立接口js文件；然后确定baseURL和url后缀；最后输入需要获取数据的代码即可。千锋教育截止目前已在北京、深圳、上海、广州、郑州、成都、大连等20余个核心城市建立直营校区，服务近20万学员、近千所高校和数万家企业。
VUE是前端开发框架。诞生于2014年吧。
原始的前端开发框架需要工程师写html、写css、写javascript(js)。js是脚本语言，浏览器可以运行js来执行一些js支持的动作，例如点击反馈，下拉菜单、 *** 作html的DOM元素之类。这样开放效率就很低了。
后来诞生了一些前端开发框架，VUE就是其中之一。目前在国内前端开发中，特别是手机app的h5页面的开发部分，被很多公司采用。
使用VUE开发的时候，不需要js直接 *** 作html元素，只需要管理js的变量值，html会自动更新这些值。传统的html配合js能完成的功能，VUE都给出了实现方案，开发只写简单的html和js语句就可以实现。
VUE开发的工具一般是visio stdio code（vscode），稍微适应两天就可以熟练应用了。还是很强大的。
但是vscode本身只是编辑器，开发编译类语言需要自己配编译环境，具体我没配过。
前端开发不需要配编译环境了，只需要把需要的各种库、工具在命令行界面安装就行。具体过程网上搜“从零开始搭建vue项目”。
刚建立好的项目一定是下面这种目录结构（ranktablevue是我后加的
这对于新手村的人会引起头晕呕吐，老子啥都没写就出来这么多文件，不但数量不少，文件种类还齐全。
学习VUE别想一下吃的太多，除非你本身前端经验丰富。否则先看懂红色箭头的几个文件吧，看懂这几个就算入门了。看的顺序严格按照下面这样。
indexhtml->mainjs->Appvue->indexjs->HelloWorldvue
我将这几个文件大概讲一讲，你就能有个清晰的脉络了。
一、indexhtml
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=10">
<title>tradedatapy</title>
</head>
<body>
<div id="app"></div>
</body>
</html>
页面开发当然是要有html了，VUE开发也不例外。这个html就是整个项目的入口了。只不过是<body>里面过于简单。<div id="app"></div>表示本html绑定了一个id为app的VUE对象。
二、mainjs
new Vue({ //new Vue语句就是定义了一个VUE对象
el: '#app', //vue对象的id是app
router,
components: { App }, //vue的组件名是APP
template: '<App/>' //template 名是APP
})
这就定义了一个app的VUE对象，indexhtml就可以找到它了。
三、Appvue
<template>
<div id="app">
<router-view/>
</div>
</template>
<script>
export default {
name: 'App' //export 了名为App的组件，mainjs就可以找到它了
}
</script>
上面的template都理解为html的一部分片断就行了，片断可以拼接到html对应的位置，构成一个有内容的完整的页面。<img src="/assets/logopng">这句被我注释了，否则页面会显示这个的。下面的<route-view/>部分是路由，根据用户的url不同，会路由到不同的vue文件，进而展示不同的页面内容。
四、indexjs
项目里有不只一个indexjs，一定看准了，我要讲解的是router目录下的indexjs
//这里的配置决定了Appvue里<router-view/>位置会展示什么内容
export default new Router({
routes: [
{
path: '/', //当用户访问 >
7:3。国内各城市vue和react占比7:3。在国内大部分前端程序员用Vue比较多，比较好上手，在加上对中文友好，遇到问题搜索出的中文结果比较多，而且对于一些国内中小型公司，大多数都是采用Vue开发。
项目有用到 Google autocomplete for addresses and search , 这个是谷歌 官网文档
，因为项目用的是 vue ，有dalao已经写好的有组件了叫做： vue-google-autocomplete ，可在 仓库地址 查看具体用法。
效果图：
先在 indexhtml 的 head 标签中引入api js文件, YOUR_API_KEY_HERE 可以在google map api官网获取。
安装: npm / yarn 自己选一个
在要使用的组件中先导入
不要忘记加入 components 中
在 template 中使用
country 是指定城市，可以有个字符串也可以有个数组，具体可看github。因为没有 v-model ，所以可以通过 inputChange 事件实现获取用户输入的值。
还有一些其它花里胡哨的属性和事件，官网也没有详写
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）