HotAreaInput

组件描述组件描述组件描述组件描述组件描述组件描述。

基础用法

基础用法基础用法基础用法基础用法基础用法基础用法。

basic.vue

<template>
  <dk-hot-area-input v-model="data" />

  <p>
    数据：
    {{ data }}
  </p>
</template>

<script setup lang="ts">
import { ref } from 'vue'

const data = ref({
  background:
    'https://dk-independence-1251560393.cos.ap-chengdu.myqcloud.com/image/2024/01/cbe23202401220119473374.jpg',
  width: 500,
  height: 500,
  views: [
    {
      css: {
        left: 156,
        top: 181,
        width: 100,
        height: 100,
        borderRadius: 0,
        borderColor: '#fff',
      },
      url: '',
    },
  ],
})
</script>

组件配置

HotAreaInput Props

属性	说明	类型	默认值
type	参数类型	string	-

HotAreaInput Events

事件名	说明	参数
click	点击触发的事件	(event: MouseEvent) => void

HotAreaInput Slots

插槽名	说明
default	自定义默认内容

类型定义

组件导出以下类型定义

import type { HotAreaInputProps } from '@vipl520/dk-ui'

样式变量

组件提供了下列 CSS 变量，可用于自定义样式。

名称	默认值
--dk-hot-area-input-background	-