vite-plugin-markdown-preview
vite-plugin-markdown-preview copied to clipboard
这个插件可以生成vue组件的使用文档吗?
比如这组件,生成使用文档,不止体验文档
<template>
<a-input readonly allowClear :value="value" :maxlength="8" :size="meta?.size" :disabled="meta?.disabled" :placeholder="meta?.placeholder" @click="inputVisible = !inputVisible">
<template #suffix>
<UpOutlined />
</template>
</a-input>
<a-card :bordered="false" v-show="inputVisible">
<a-space>
<a-input-number :size="meta?.size" v-model:value="day" addon-after="天" :min="1" :max="meta?.dayMax || 31" :placeholder="meta?.dayPlaceholder" />
<a-input-number :size="meta?.size" v-model:value="hours" addon-after="小时" :min="1" :max="meta?.hoursMax || 23" :placeholder="meta?.hoursPlaceholder" />
</a-space>
</a-card>
</template>
<script setup lang="ts">
/**
* @author 全易
* @time 2024-09-06 13:26:36 星期五
* @description 天+时 时效输入框
* @use <MTimeLimit v-model="value" :value="value" /> 【v-model="value" 联动子组件数据 :value="value" 是默认值】
**/
import { ref, watch } from 'vue';
import { UpOutlined } from '@ant-design/icons-vue';
const props = defineProps<{
value?: string // 默认值
meta?: any // 元数据
}>()
const day = ref();
const hours = ref();
const inputVisible = ref(false);
const value = defineModel();// 双向绑定父组件
// 默认赋值
watch(() => props.value, (now) => {
value.value = now || "";
day.value = parseInt(now?.split(" ")[0] as string); // 空格分割
hours.value = parseInt(now?.split(" ")[1] as string); // 空格分割
}, { immediate: true });
// 双向绑定视图层
watch(() => [day.value, hours.value], ([day, hours]) => {
value.value = `${day ? day + '天' : ''} ${hours ? hours + '小时' : ''}`; // 必须空格
})
</script>
<style scoped lang="scss"></style>
这个插件可以生成组件的参数、事件、方法、插槽等对应的md是文件,可以吗?