当前位置: 首页 > Web前端 > vue.js

蔡13(11.27)前端的爬坑之旅

时间:2023-04-01 00:37:42 vue.js

1、vue单页引入v-for显示item问题:场景:在前后端不分离的项目中,引入单页vue,使用v-for渲染时出现的{{item}}无法显示直接使用v-show判断数据是否存在原因:在加载VueJs之前,根据浏览器的渲染机制解析页面。方法:在没有数据之前,使用级联样式表(CSS:display:none)强制控制数据隐藏但渲染的元素仍然要使用v-show,v-show会在vue之后接管css的控制引入:"application/json;charset=utf-8"记录一旦springMVC接收到前端数组对象的爬取记录。b.这次爬坑主要集中在js部分b1中ajax请求的形式。不能使用$.post形式,因为必须指定一些特殊属性,否则会出现415、406等请求错误信息b1。$。post表单需要指定一些特殊的属性,否则会出现415、406等请求错误信息。一个可行的例子如下varobjArr=[{'pid':10,'name':'song'},{'pid':11,'name':'xxx'}]console.log(objArr.toString())$.ajax({contentType:"application/json;charset=utf-8",type:'POST',dataType:"json",//表示返回值类型,非必须data:JSON.stringify(objArr),网址:'/临时/请求列表',成功:function(){}});--RequestBody注解可以用来接收contentType为application/json的请求--contentType默认值不是application/json,所以需要指定--必须指定type,默认为get--dataType不需要指定——数据需要JSONstringify()。这个方法返回的是字符串类型,没有这个方法传到后台的是一些奇怪的东西。在这个例子中,它是song=&xxx=2。参考文章链接:https://blog.csdn.net/wabioz...3.ajax参数介绍http://www.w3school.com.cn/jq...4.最后补充:if参数json中包含日期,格式写成'yyyy-mm-dd',不加时分秒;后来发现配置后台Access-Control-Allow-Origin:*还是获取不到数据。Res.header('Access-Control-Allow-Origin','*');res.header('Access-Control-Allow-Methods','GET,POST,PUT,DELETE,PATCH');res.header('Access-Control-Allow-Headers','Origin,X-Requested-With,Content-Type,Accept,Authorization');注意:本地开发时后台是可配置的。如果在线部署,建议移除。3.VueComputed计算属性缓存场景:意外收获使用自制的三个数据绑定(滑稽:名字是根据三个的幂来改的)。读取数据时,由于初始化和计算,值发生变化属性值读取为0guess:每次读取值属性调用值初始化方法:getNumSum:{//cache:false,get:function(){letgetNumSum=0;对于(leti=0;i给组件套上(thisis:app)v-modelcontrolvaluevinVuev-for-model="item.titleName=='totalscore'?getNumSum:a1[index].selfAssessScore"idea中的一些前端技巧idea是一个比较少用的前端编辑器,但不能否认其强大的下载插件VueJs.jar数组方法排序函数compare(property){returnfunction(a,b){varvalue1=a[property];varvalue2=b[属性];如果(ArrsortFlag==true){返回值2-值1;//反转value1-value2正序}else{returnvalue1-value2;}}}this.a1=this.a1.sort(compare('selfAssessScore'))CSS样式Vue官网赞助列表激活状态灰色操作:filter:grayscale(100%);