Vue-每日小知识(9/26)

知识介绍

1. 多参数返回函数: 使用解构赋值

代码分析

// 根据缩放比例计算图像显示属性，返回图像在SVG中的显示区域(左上x,左上y,w,h)
const calculateImageAttributes = (scale, imageSize, svgSize) => {
  const W = imageSize.width * scale;
  const H = imageSize.height * scale;
  const X = (svgSize.width - W) / 2;
  const Y = (svgSize.height - H) / 2;
  return { X, Y, W, H };
};

// 使用解构赋值，将返回的对象属性赋值给已定义变量
({ X: imageInScopeX, Y: imageInScopeY, W: imageInScopeW, H: imageInScopeH } = calculateImageAttributes(scale, imageSize, svgSize));