分类 javascript语言 下的文章

js、vue在数组中找某类值 并删除


我相信,好多查这个问题的人都知道怎样删除数组数据。但在查找情况下,及查到一个值删除一个值,就不会了
vue删除值通常有3种
arr.aplice(索引值,删除长度);
delete arr[索引值];
this.$delete(arr,索引值);

那问题来了,查找呢?
开始我是这样写的,哈哈,发现有问题,删除某一项数据后,数组大小会变,按索引值不对后面就不对了

for(let s in data){
   if(data[s] == search){
        data.splice(s,1);
   }
}

这个问题纠结我了好久,突然想到,把数组倒过来查并删除数据项,就不会出现这样的情况了,突然想通过了,有点好气的感觉,原来,就这么简单。哈哈,你是不是也有这样的感觉?

for(let s=data.length-1;s>=0;s++){
   if(data[s] == search){
        data.splice(s,1);
   }
}

Vue.js 当遇到单选按钮 选不中情况


问题的出现:
当单选的模板也是数据配置时,出现数字的key 不能 正常渲染

如:
options 是这样的数据时,就想做三个选项,但这三个选项也是数据配置项,key为数字时不能正常渲染
options:{1:'二手市场', 2:'新闻页',3:'趣味中心'}

<el-radio
        v-for="(item,i) in options"
        v-model="formData[fd.prop]"
        :label="i"
        :key="i"
        :disabled="readonly">
    {{item}}
</el-radio>

出现情况分析
应该是数据类型不匹配
formData[*]打印出数据类型是number
那应该就是options在后续的处理中,已经把数据类型变了

解决办法
当判断 formData[*]为number时,强制性把 options 的key转化为number

<el-radio
        v-for="(item,i) in options"
        v-model="formData[fd.prop]"
        :label="(typeof formData[*] == 'number')?Number(i):i"
        :key="i"
        :disabled="readonly">
    {{item}}
</el-radio>

uniapp flex 自适应高度 区域里面内容滚动


如下代码,想在页面box中,content固定高度,box-c区域填满其他区域,scroll-view 区域内滚动

<view class="box">
  <view class="content">
   hello
  </view>
  <swiper class="box-c">
   <swiper-item class="child">
    <scroll-view :scroll-y="true">
       足够高的滚动区域
    </scroll-view>
   </swiper-item>
  </swiper>
 </view>

样式如下

 .box{
  display: flex;
  flex: 1;
  flex-direction: column;
  overflow: hidden;
  background-color: #ffffff;
  height: 100vh;
 }
 .content{
  height: 70upx;
  background: #CCCCCC;
 }
 .box-c,.child{
  display: flex;
  flex: 1;
 }

总结:swiper 和 swiper-item 都要做填满操作,否则不成功


js 数组、对象push不了


你可能没有遇到这样奇葩的事,对应一个数组老是push不进去数据,typeof 打印为object,你就蒙了,为什么会出现这样的情况,这个题难了我好久,先看一下我写的代码。
var ab = [{a:1}];
var b = {b:2};
var c = ab.push(b);
console.log(c);

这个结果为多少!?

我就觉得c打印为[{a:1},{b:2}];

结果,老是不出现想要的结果,还以为是vue默认吧数组转化为对象造成的。

其实不然,是自己没有把js基本语法弄明白

其实push是有一个返回数组总长的结果,本案例中c的结果是2,哈哈,ab的结果才是:[{a:1},{b:2}]