js函数传参 有默认参数时,不覆盖原有参数并传入新的参数

使用插件时,有时插件会有默认参数,但是业务需求又需要传入新的参数,所以碰到这个问题,目前发现两种解决方法
第一种:

<template>
  <div class="home">
    <el-cascader
      placeholder="请输入 / 选择"
      v-model="areaCode"
      :options="options"
      :props="{ multiple: true, expandTrigger: 'hover' }"
      @change="handleChange(1, $event)" // 默认事件放在最后一位,前面可以加任意位的参数
      collapse-tags
      filterable
    ></el-cascader>
  </div>
</template>
 
<script>
export default {
  name: "",
  data() {
    return {
      options: [
        {
          value: "zhinan",
          label: "指南",
          children: [
            {
              value: "shejiyuanze",
              label: "设计原则",
              children: [
                {
                  value: "yizhi",
                  label: "一致",
                },
              ],
            },
          ],
        },
      ],
    };
  },
  created() {},
  methods: {
    handleChange(state, e) {
      console.log(state, e); // 1, ['zhinan', 'shejiyuanze', 'yizhi']
    },
  },
};
</script>

第二种:

<template>
  <div class="home">
    <el-cascader
      placeholder="请输入 / 选择"
      v-model="areaCode"
      :options="options"
      :props="{ multiple: true, expandTrigger: 'hover' }"
      @change="
        (event) => {
          handleChange(event, 1);
        }
      " // 增加一个回调函数,先传入事件,再调用要使用的函数后依次传入参数
      collapse-tags
      filterable
    ></el-cascader>
  </div>
</template>
 
<script>
export default {
  name: "",
  data() {
    return {
      options: [
        {
          value: "zhinan",
          label: "指南",
          children: [
            {
              value: "shejiyuanze",
              label: "设计原则",
              children: [
                {
                  value: "yizhi",
                  label: "一致",
                },
              ],
            },
          ],
        },
      ],
    };
  },
  created() {},
  methods: {
    handleChange(state, e) {
      console.log(state, e); // [ "zhinan", "shejiyuanze", "yizhi" ] 1
    },
  },
};
</script>

原文

你可能感兴趣的:(javascript,前端,开发语言)