Vue 3 + Vite 搭建项目

This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 <script setup> SFCs, check out the script setup docs to learn more.

...大约 7 分钟

This template should help get you started developing with Vue 3 and TypeScript in Vite. The template uses Vue 3 <script setup> SFCs, check out the script setup docs to learn more.

...大约 9 分钟

常用软件

System Tools

3DMark
7z/7zTM
Aria2
CCleaner
CPU-Z
Dism++
Everything
Fences
GPU-Z
LockHunter
PotPlayer
Remote Desktop Manager
ScreenToGif
Shadowsocks
Stardock
VMware
Watt Toolkit
XDown

...小于 1 分钟

H5 端引用 uni-popup 组件异常

H5 端引用 `uni-popup` 组件异常

问题复现

页面代码引用了一个第三方的 sku 组件及 uni-popup 组件，在微信小程序端正常使用，无异常报错，而切换为 H5 端（Chrome 浏览器）运行时报错误了。

异常信息截图

<!-- 商品详情页面主要代码 -->
<template>
	<vk-data-goods-sku-popup
		ref="skuPopup"
		v-model="isShowSku"
		border-radius="20"
		:localdata="goodsInfo"
		:mode="mode"
		:actived-style="{
			color: '#27BA9B',
			borderColor: '#27BA9B',
			backgroundColor: '#E9F8F5',
		}"
		add-cart-background-color="#ffa868"
		buy-now-background-color="#27ba9b"
		@add-cart="addCart"
		@buy-now="buyNow"
	/>

  ...

	<scroll-view enable-back-to-top scroll-y class="viewport">
		...
	</scroll-view>

	...

	<!-- uni-ui 弹出层 -->
	<uni-popup ref="popup" type="bottom" background-color="#fff">
		...
	</uni-popup>
</template>

...大约 2 分钟

地图面积计算

基于高德地图，根据用户选点（鼠标移动）创建标注点，满足至少三个标注点时可以形成多边形并计算其面积，采用命令模式实现撤销功能。

功能

创建标注点
创建标注点之间的连线
计算面积
撤销及清除重绘

绘制多边形实体类代码

// 画多边形区域类
class DrawPolygon {
  ...

  constructor(map, id) {}

  // 获取实例数据
  getData() {}

  // 判断当前的标注点能否组成图形
  isCanSetPolygon() {}

  // 获取第一个标注点
  getFirstMarker() {}

  // 鼠标点击时生成标注点
  addMarker(lngLat) {}

  // 满足两个点时生成折线
  addLine(last, current, lineStyle = "solid") {}

  // 删除连线
  removeLine() {}

  // 判断能否形成多边形
  canCalcArea() {}

  // 生成多边形并计算面积
  addPolygon() {}
}