关于前端开发的小坑

Array 大家有用过，其中元素选择和删除是用的比较多的

let arr=[1,2,3,4,5];
// splice   slice  要区分
console.log(arr.splice(1,1))；// 从1位开始截取1位打印 [2]
console.log(arr); //这时候arr被改变  输出 [1,3,4,5]

console.log(arr.slice(1,1))；//从1位开始1结束 输出[]
console.log(arr.slice(0,1));//从0位开始1结束 输出[1]
console.log(arr); //这时候arr不变  输出 [1,3,4,5]

结论 splice slice 长得很像区别可大呢传入参数含义不同；操作数组方式不同；

Date 日期处理大家也用的多吧

\\获取年的区别
let date=new Date();
console.log(date.getYear());//输出 120

//正确获取年
date.getFullYear();
//获取月份  注意是 0~11   正确显示还得+1
date.getMonth()+1;

//错误案例，有的为了方便,和字符串写成一句话
console.log("本月是"+date.getMonth()+1+"月"); //输出  本月是21月

//获取今天几号
date.getDate();

//获取今天第几天  0开头
date.getDay();

与字符串加减运算做个吧

console.log("1"-1);// 输出 0

console.log("1"+1);// 输出 11

结论只有 - 才能与字符串直接运算加法运算时 parseInt(str) 或者 "1"-(-1)

电商项目有关于钱的计算吧 1.2元优惠1元

console.log(1.2-1);//输出  0.19999999999999996

console.log(1.2+1);//输出 2.2

结论别在前端做价格运算

vue 入门采坑记

父子组件传值100%用过吧

//父==  props ==》子
//父《==  $emit == 子
<template>
    <er-zi   :userInfo ><er-zi>
<button @click="update">改名字结婚</button>
</template>

<script>
  
export default {
        data(){
          return {
      
              userInfo:{
                     erZi: [{
                      name:'小王',
                      age:24
                       }
                      ]，
                    nvEr:[{
                        name:'花花',
                      age:12
                      }]
                  }
        }
    },
methods:{
  update(){//改名字结婚，不然亲家以为我就是老王了
      this.userInfo['erZi']=[{
            name:'王捶捶',
            age:24
      },{
         name:'妻子'，
            age:20
    }]
        }
    }

}

</script>

问题：props是动态绑定，应该改完名字结了婚就会显示出来，可是vue不知道，界面没有动态刷新查资料发现：props 传入的动态参数比较复杂，有数组的情况时，js有限制，识别不到数据有变化，所以界面不刷新。解决：直接告诉vue数据变化了，你帮我从新显示。 this.$set(this.userInfo,'erZi',data);

基础部分就遇到过这些坑，若有大侠跳过别的坑留下你的脚印

前端开发记录（一）

关于前端开发的小坑

vue 入门采坑记