彭帅胸围,无疼蓝,犬夜叉小游戏
一:freemarker的使用
1:java后台使用freemarker是通过model,将值传给前端:
如:
@controller public class mobilenewsfreemarkercontroller { @requestmapping("page/test") public string test(model model,httpservletrequest request){ //获取项目路径 string basepath = request.getscheme()+"://"+request.getservername()+":"+request.getserverport()+""+request.getcontextpath()+"/"; //将页面路径通过model传给前台 model.addattribute("basepath", basepath); //通过httpservletrequest 获取url中的值,如code值 string code = request.getparameter("code"); //将获取的code参数传给前台 model.addattribute("code ", code ); //页面跳转 return "page/test"; } }
2:前端页面获取后台传输的值(freemarker传输的值只能在html页面获取)
注:这里是结合vue
第一步:在js中定义vue的相关参数:
var vm = new vue({ el: '#rrapp', data: { basepath:"", //项目路径 code : "", // code参数 }, ..........(vue后面内容省略)
第二步:再在页面接收后台传输的值
<head> <script type="text/javascript"> $(document).ready(function() { <#if basepath??> vm.basepath="${basepath}"; </#if> <#if userid??> vm.code ="${code }"; </#if> }); </script> </head>
二:使用中主要遇到的问题
1:vue存在调用的先后顺序,虽然html页面将后台传输的值付给vue的data中的参数,但是在mounted中是无法使用的时候获取的还是创建的vue的时候data中赋的值,并不会使用html赋的值:
如:
var vm = new vue({ el: '#rrapp', data: { basepath: "", code :"", }, mounted: function () { var _this = this; console.log(_this.basepath); //输出的还是:"",并不会输出html赋的值,所有在这里无法使用 }
2:但是在vue中methods内的方法是可以直接使用的;初始化如果需要html中传输的参数,可以使用以下方法:
$(function () { vm.getdata(vm.basepath,vm.code); }); var vm = new vue({ el: '#rrapp', data: { basepath: "", code :"", }, methods: { getdata: function (baseurlflag,codeflag) { var _this=this; _this.basepath= baseurlflag; _this.code =codeflag; //进行初始化业务操作! }, }
总结
以上所述是小编给大家介绍的后台使用freemarker和前端使用vue的方法及遇到的问题,希望对大家有所帮助
如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复
VUE+elementui组件在table-cell单元格中绘制微型echarts图
Vue通过getAction的finally来最大程度避免影响主数据呈现问题
vue 路由懒加载中给 Webpack Chunks 命名的方法
网友评论