代码知识
代码基础知识性问题
pgzero
这个作者很懒,什么都没留下…
展开
-
vue 事件处理函数传递e对象和额外的参数
<switch :checked="isChecked" @change="switch4Change($event,4)" color="#57BE6C"/>switchChange(e,value){ console.log(e.detail.value,value) // true 4},第一个参数为event对象,第二个参数为额外要传入的值原创 2021-12-31 23:59:51 · 1656 阅读 · 0 评论 -
js操作对象方法
1、遍历对象并赋值Object.keys(this.form).forEach(key=>{this.form[key]=''})原创 2021-12-31 16:37:33 · 438 阅读 · 0 评论 -
css3实现正反面翻转效果
<div class="box"> <div class="positive" :class="onoff == 1 ? '' : 'positive'"></div> <div class="anti" :class="onoff == 0 ? '' : 'anti'"></div></div>export default { data() { return { onoff:1, } }}<st原创 2021-01-18 22:29:25 · 1039 阅读 · 0 评论 -
vue数组或对象直接赋值问题
data:{ index:0, list: [ { title:'名字1', }, { title:'名字2', } ], froms:{ title:'' }},methods:{ change(){ this.list[index] = this.froms; //这会导致改变froms的数据的时候,list[0]也会改变; //可使用JSON.pars原创 2021-12-23 11:22:11 · 2719 阅读 · 0 评论 -
vue和uniapp改变数据但是不改变视图的原因
一、数组1、当直接用索引直接设置一个项的时例如:this.arr[index] = newArr解决方法:this.$set(this.arr,index,newArr);2、当直接修改数组长度时例如:this.arr.length = newLength解决方法:this.items.splice(index,1,newArr) 或者this.items.splice(newLength)二、对象1、由于Javascript的限制,Vue不可以检测对象属性的添加或删除var obj =原创 2020-05-28 14:25:00 · 2488 阅读 · 0 评论 -
前端传参时如何对数据进行安全加密
一、正常不进行请求的加密方式:app调用:http://api.test.com/api?参数1=1&参数2=2此方式会存在很严重的安全性问题,没有进行任何的验证,大家都可以通过这个方法获取到信息,导致数据泄露,并有可能会被篡改数据,造成更严重的问题。那么如何验证调用者身份并防止参数被篡改呢?二、使用MD5进行签名加密加入一个对应的secret并在调用接口时进行数据验证1、按照参数名把参数a:1,c:2,b:4进行首字母排序并进行拼接得到字符串a1b4c22、把secret加到字符串头部原创 2020-07-20 22:08:03 · 6529 阅读 · 0 评论 -
VUE如何同时监听多个变量的变化
使用computed配合watch监听变量变化data() { return { username:'', password:'' }},computed: { changeData() { const { username, password} = this return { username, password } }}, watch: { changeData(e) { //写入你需要监听的事件 } }原创 2020-06-04 20:59:07 · 2451 阅读 · 0 评论 -
vue如何使用MD5加密
一、npm安装:npm install --save js-md5二、需要使用的文件内部引入import md5 from 'js-md5';md5('holle')或注册成全局使用import md5 from 'js-md5';Vue.prototype.$md5 = md5;原创 2020-07-20 20:09:31 · 217 阅读 · 0 评论 -
Vue获取点击元素到顶部的距离
//template<div @click="add($event)")></div><div class="top" ref="top"></div>//methodsadd(e){ e.currentTarget //获取当前dom元素后可进行操作 //获取元素距离视口高度 var top1 = e.currentTarget.getBoundingClientRect().top //获取滚动条位置 var top2 = doc原创 2021-03-09 10:20:58 · 8856 阅读 · 0 评论 -
uniapp的nvue页面(weex)使用css的注意事项
1、在 nuve页面 中,Flexbox 是默认且唯一的布局模型。2、宽度使用100%无效,如需撑满页面可使用 width:750upx;3、nuve设置边框使用border:1px solid #d91d5a是无效的,需如下设置:border-width: 1px;border-color: #d91d5a;border-radius: 30upx;4、不可直接对父级div元素直接设置text的样式,需对文字单独设置样式5、如需在nvue页面设置溢出隐藏,则需在text设置如下属性:li原创 2020-05-29 15:08:16 · 5283 阅读 · 0 评论 -
vue如何动态绑定多个class名称
三元运算绑定多个class名称:class="[a==2?'class':'',b==3?'class':'class1']"三元运算多次判断绑定class:class="a==1?'class':a==2?'class1':a==3?'class3':''"原创 2021-01-18 21:28:01 · 1624 阅读 · 0 评论 -
使用uniapp如何实现锚点定位和滚动监听功能
一、如何实现锚点定位在scroll-view组件中有一个scroll-into-view属性:(值应为某子元素id。设置哪个方向可滚动,则在哪个方向滚动到该元素)。此属性的意思则是此属性的值为子元素设置的id时,则可跳转到子元素位置例如上面图片代码,点击tab切换栏时,改变toView的值,使其为对应下方id则可实现滚动到当前子元素位置二、如何实现滚动到子元素位置时改变tab栏状态此选择器可得到元素距离顶部的位置,在@scroll事件中监听子元素距离顶部距离,则可实现滚动改变tab栏状态功能原创 2020-05-12 09:32:46 · 8428 阅读 · 0 评论 -
VUE监听循环多个input值获取方法
我们在获取后端数据的时候,有时候会在列表中生成很多的input,而我们又想实时监听这些input时要如何处理呢<tr v-for="(item,index) in bstp" v-if="bstp"> <td><input type="text" name="" @input="newVal(index,item.value)" v-model="item....原创 2020-04-22 08:50:36 · 3468 阅读 · 0 评论 -
uniapp如何在图片加载好之前展示默认图片
<image :src="url" mode="" class="video_li_img" v-show="onoff=='0'"></image><image :src="img" @load="onoff='1'" mode="" class="video_li_img" v-show="onoff=='1'"></image>使用image的@load,使其加载好再进行展示原创 2020-06-29 14:46:56 · 8014 阅读 · 3 评论 -
VUE如何通过页面修改子组件样式
使用深度作用选择器,就可以在父组件中修改子组件的样式#demo >>> .inner { font-size: 40px;}深度作用选择器语法:父组件根元素选择器 >>> 子组件选择器注:如果是sass或less这种预编译语法则 不支持 >>> 这种形式有另外一种形式支持: /deep//deep/同时也支持css#demo /deep/ .inner { font-size: 40px;}...原创 2020-06-29 10:53:28 · 686 阅读 · 0 评论 -
js将字符串按照换行符分隔成数组
//转换成数组snsArr=str.split(/[(\r\n)\r\n]+/);//删除空项snsArr.forEach((item,index)=>{ if(!item){ snsArr.splice(index,1); }})原创 2020-09-22 13:24:26 · 10092 阅读 · 2 评论 -
js求数组最大值最小值方法
1、假设法假设当前数组中的第一个值是最大值,然后拿这个最大值和后面的项逐一比较,如果后面的某一个值比假设的值还大,说明假设错了,我们把假设的值进行替换。最后得到的结果就是我们想要的。// 获取最大值:var arr = [22,13,6,55,30];var max = arr[0];for(var i = 1; i < arr.length; i++) { var cur = arr[i]; cur > max ? max = cur : null}consol原创 2021-06-16 10:35:59 · 2728 阅读 · 0 评论 -
ios使用border-radius时失效
出现此问题的原因是因为ios手机会在transform的时候导致border-radius失效解决方法:在使用动画效果带transform的元素的上一级div元素的css加上下面语句:-webkit-transform:rotate(0deg);原创 2020-12-08 01:26:47 · 2570 阅读 · 0 评论