vue2 处理多个类似的函数，但是函数中的变量名不一样，怎么优化

vue2 中有多个相同的方法，但是处理的数据不一样，怎么优化

比如有drawRoom，drawDesk，drawOffice类似的方法，只是处理的数据不一样，怎么通过参数来处理不同的情况

比如参数type是desk，我就处理this.deskData，type是room，我就处理this.roomData，即需要一个转义的写法，我就不用重复写类似的方法了。

可以使用一个通用的方法，然后根据参数来决定使用哪个数据进行处理。例如：

draw(type, filterData, hasData = true) {
  if (!hasData) {
    return;
  }

  let data;
  switch (type) {
    case 'desk':
      data = this.deskData;
      break;
    case 'room':
      data = this.roomData;
      break;
    case 'office':
      data = this.officeData;
      break;
  }

  let that = this;
  if (filterData && filterData.length > 0) {
    filterData.forEach((si, sk) => {
      data.forEach((item, k) => {
        // 处理数据
      });
    });
  } else {
    // 其他情况的处理
  }
}

然后在调用这个方法的时候，传入不同的参数即可。例如：

this.draw('desk', filterData);

或者

this.draw('office', filterData);

望采纳。

望采纳！！点击该回答右侧的“采纳”按钮即可采纳！
我就拿你的例子举例吧，你可以定义一个名为 draw 的方法，并将需要绘制的对象的类型作为参数传递给该方法。然后，你可以在方法内部根据参数的值来执行不同的操作。
比如：

methods: {
  draw(type) {
    if (type === 'room') {
      // 绘制房间
    } else if (type === 'desk') {
      // 绘制桌子
    } else if (type === 'office') {
      // 绘制办公室
    }
  }
}

然后，你可以在组件的模板中调用该方法，并传递参数来指定要绘制的对象类型：

<template>
  <button @click="draw('room')">绘制房间</button>
  <button @click="draw('desk')">绘制桌子</button>
  <button @click="draw('office')">绘制办公室</button>
</template>

此外，你还可以使用计算属性来简化代码

computed: {
  drawRoom() {
    return () => this.draw('room')
  },
  drawDesk() {
    return () => this.draw('desk')
  },
  drawOffice() {
    return () => this.draw('office')
  }
}

然后，你可以在模板中使用计算属性来调用方法：

<template>
  <button @click="drawRoom">绘制房间</button>
  <button @click="drawDesk">绘制桌子</button>
  <button @click="drawOffice">绘制办公室</button>
</template>