vue3-manner-report v0.1.11

组件下载

npm i vue3-manner-report

组件效果预览

全局使用方法

在 vue3 项目中全局引用的方式

//main.ts or main.js
import { createApp } from 'vue';
import App from './App.vue';
import Vue3MannerReport from 'vue3-manner-report';
import 'vue3-manner-report/lib/style.css';

const app = createApp(App);

app.use(Vue3MannerReport);
app.mount('#app');

如果使用 ts+vite 的方式，需要在 env.d.ts 中加入最后一句声明，否则 ts 会检测报错。

/// <reference types="vite/client" />
declare module '*.vue' {
	import type { DefineComponent } from 'vue';
	// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
	const component: DefineComponent<{}, {}, any>;
	export default component;
}

declare module 'vue3-manner-report';

组件内使用

<script setup></script>

<template>
	<ml-report dbWidth="300" @onSave="onSave" :reportName="reportName" :dbList="menuList" :sheets="sheets" />
</template>

<style></style>

参数说明

方法说明