vue中常用的一些命令

2.label和value

以下是我个人理解，有错误之处还请指正。当我们在进行选择下拉的时候，首先要进行双向绑定，这里的v-model="value"就是设置了双向绑定，表示页面渲染时读取的是value中的值，数据输入后写入的也是value的值，所以叫双向绑定。:label表示选择的框中可以选择的是label中的值，label英文是标签的意思。而value中的数值是后端直接传入的数值，是真正写入后端的数值，注意这里label和value可以是一个相同的属性，所以有时候看起来是label里的数值直接传入了后端，其实是一个巧合，真正进入后端的是value中的值。

<template>
  <el-select v-model="value" placeholder="请选择">
    <el-option
      v-for="item in foodList"
      :key="item.value"
      :label="item.label"
      :value="item.value">
    </el-option>
  </el-select>
</template>

<script>
import ...

export default {
    data() {
        return {
          foodList:[
            {label:"馒头",value:"1"}
            {label:"包子",value:"2"}
            {label:"米饭",value:"3"}
            {label:"担担面",value:"4"}
          ]
        }
    }
}
</script>

map 

3.ref、refs、$refs

//获取$refs
handleChange(){
       const checkedNodes = this.$refs['cascaderregion'].getCheckedNodes()
       console.log(checkedNodes) // 获取当前点击的节点
       console.log(checkedNodes[0].data.label) // 获取当前点击的节点的label
       console.log(checkedNodes[0].pathLabels) // 获取当前点击的节点的label数组
}

4.splice()方法

splice是拼接的意思，splice("index，数组开始下标，起始位置","len，替换/删除的位数（长度）","[item]，替换的值（删除操作的话 item为空），拼接字符，整数。。。")三个参数，可灵活选择的使用对数组内数组内某一个或者几个值进行添加、替换、删除操作（该方法会改变原始数组）。

数组开始的下标可以用indexOf("数组中的值")表示,返回该值在数组中的索引，既下标。

添加：在下标为1处添加一项'eat'

var arr = ['a','b','c','d'];
   arr.splice(1,0,'eat');
   console.log(arr);        
//['a','eat','b','c','d']


var arr = ['a','b','c','d'];
   arr.splice(list.indexOf(b),0,'eat');        //删除0个，在b对应的下标处插入‘eat’
   console.log(arr);        
//['a','eat','b','c','d']

修改（不想创建新的数组的前提下修改数组中的某个值，即替换）：

var arr = ['a','b','c','d'];
   arr.splice(1,1,'eat');         //替换起始下标为1，长度为1的一个值为‘eat’，len设置的1
   console.log(arr);        
//['a','eat','c','d']
     
var arr1 = ['a','b','c','d'];
   arr1.splice(1,2,'eat');             //替换起始下标为1，长度为2的一个值为‘eat’
   console.log(arr1);       
//['a','eat','d']

(,1,0);
//结果：[1,0,3,4],完成数组值修改

var arr2 = ['a','b','c','d'];
   arr2.splice(arr2.indexOf(b),2,'eat');    //替换b对应下标处的对象，长度为2的一个值为‘eat’
   console.log(arr2);       
//['a','eat','d']

删除：删除起始下标为1，长度为1的一个值(len设置1，如果为0，则数组不变)

  var arr = ['a','b','c','d'];
    arr.splice(1,1);
    console.log(arr);  
    //['a','c','d'];
     
    var arr1 = ['a','b','c','d']
    arr1.splice(1,2);
    console.log(arr1);
    //['a','d']

var arr2 = ['a','b','c','d']
    arr2.splice(arr.indexOf(b),2);        //删除b对应下标处开始的2个对象
    console.log(arr2);
    //['a','d']