<template>
  <div class="kole-popover kole-popover-popover-wrap"><button class="kole-popover-button kole-popover-primary" type="button" :aria-expanded="open" @click="open = !open">查看信息</button><div v-if="open" class="kole-popover-popover" role="dialog">{{ props.content }}</div></div>
</template>

<script setup>
import { ref, computed } from 'vue';
const props = defineProps({
    content: { type: String, default: '这里可以放解释、统计或操作。' }, // 内容
    placement: { type: String, default: 'bottom' }, // 弹出位置
    trigger: { type: String, default: 'click' }, // 触发方式
    open: { type: Boolean, default: false }, // 是否展开
});
const emit = defineEmits(["open", "close"]);
const open = ref(Boolean(props.open));

</script>

<style src="./Popover.css"></style>
