vue3-sketch-ruler在vue3+typescript

https://www.npmjs.com/package/vue3-sketch-ruler/v/1.1.5?activeTab=versions

安装后,发现

 

 

这个没有

复制完代码,准备运行,发现缺少

vue-demi

感觉vue2整的不彻底

,没办法,yarn add  vue-demi

<template>
  <SketchRule
    :thick="thick"
    :scale="scale"
    :width="1920"
    :height="1080"
    :startX="startX"
    :startY="startY"
    :shadow="shadow"
    :horLineArr="lines.h"
    :verLineArr="lines.v"
    :cornerActive="true"
    @handleLine="handleLine"
    @onCornerClick="handleCornerClick"
  />
</template>

<script setup lang="ts">
import Vue from 'vue';
import { SketchRule } from 'vue3-sketch-ruler';
components: {
  SketchRule;
}
const rectWidth = 160; //间隔
const rectHeight = 200; //宽度间隔距离

const scale = 0.5; //658813476562495, //1,
const startX = -500;
const startY = 0;
const lines = {
  h: [100, 200],
  v: [100, 200],
};
const shadow = 2;
const thick = 20;
const isShowRuler = true;
const isShowReferLine = true;
const handleLine = (e: any) => {
  console.log(e);
};
const handleCornerClick = (e: any) => {
  console.log(e);
};
</script>

<style scoped></style>
handleLine 方法没有检测到
 
posted @ 2022-04-06 11:23  郑州谷多软件  阅读(290)  评论(0编辑  收藏  举报