34 lines
726 B
Vue
34 lines
726 B
Vue
|
|
<template>
|
||
|
|
<div class="pingpu" ref="el"><canvas ref="canvasRef"></canvas></div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup>
|
||
|
|
import {
|
||
|
|
defineComponent,
|
||
|
|
ref,
|
||
|
|
reactive,
|
||
|
|
nextTick,
|
||
|
|
toRefs,
|
||
|
|
inject,
|
||
|
|
watch,
|
||
|
|
computed,
|
||
|
|
} from "vue";
|
||
|
|
const props = defineProps({
|
||
|
|
url: { type: String, required: true },
|
||
|
|
positionX: { type: Number, default: 0 },// px
|
||
|
|
positionY: { type: Number, default: 0 },// px
|
||
|
|
angle: { type: Number, default: 0 },// 角度
|
||
|
|
size: { type: Number, default: 100 },// %
|
||
|
|
gapX: { type: Number, default: 0 },// px
|
||
|
|
gapY: { type: Number, default: 0 },// px
|
||
|
|
});
|
||
|
|
console.log("==========", props);
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang='less' scoped>
|
||
|
|
.pingpu {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
background-color: #f00;
|
||
|
|
}
|
||
|
|
</style>
|