关于项目
这是方便整合的组成部分 缩放 内 第3组。这个项目的灵感来自 减速. 它有一段时间没有更新过,只支持Vue 2.
(单位:千美元)返回顶端(中文(简体) )
内设
(单位:千美元)返回顶端(中文(简体) )
开始
先决条件
- 第3组
npm i vue
安装
npm i @f3ve/vue-markdown-it
(单位:千美元)返回顶端(中文(简体) )
使用量
导入组件
您可以直接导入您的 SFC 文件的组件 .
单位 <script setup> 语法
<!-- Vue 3 setup script syntax -->
<script setup>
import { VueMarkdownIt } from '@f3ve/vue-markdown-it';
const post = ref();
onMounted(async () => {
const res = await api.get('/post');
post.value = res.data;
});
</script>
<template>
<vue-markdown-it :source="post" />
</template>
定期 <script> 语法
<script setup>
import { VueMarkdownIt } from '@f3ve/vue-markdown-it';
export default {
components: {
VueMarkdownIt
}
setup() {
const post = ref();
onMounted(async () => {
const res = await api.get('/post');
post.value = res.data;
});
}
}
</script>
<template>
<vue-markdown-it :source="post" />
</template>
使用插件
您也可以使用插件在全球注册组件 .
// main.js
import { createApp } from 'vue';
import App from './App.vue';
import { VueMarkdownItPlugin } from '@f3ve/vue-markdown-it';
const app = createApp(App);
app.use(VueMarkdownItPlugin);
app.mount('#app');
使用减记插件
您可以使用 plugin 道具 (英语). plugin 需要一系列的下调插件 。 如果您想要配置插件的选项, 您可以在数组中嵌入插件及其选项 .
<script setup>
import { VueMarkdownIt } from '@f3ve/vue-markdown-it';
import myPlugin from 'myPlugin';
import myPluginWithOption from 'myPluginWithOptions';
const post = ref();
onMounted(async () => {
const res = await api.get('/post');
post.value = res.data;
});
</script>
<template>
<vue-markdown-it
:source="post"
:plugins="[myPlugin, [myPluginWithOptions, { option1: true }]]"
/>
</template>
使用 Markdown- it 选项和预设
见 标记- 它的文档 更多信息
选项
<script setup>
import { VueMarkdownIt } from '@f3ve/vue-markdown-it';
const post = ref();
const options = {
html: true,
linkify: true,
};
onMounted(async () => {
const res = await api.get('/post');
post.value = res.data;
});
</script>
<template>
<vue-markdown-it :source="post" :options="options" />
</template>
预设
<script setup>
import { VueMarkdownIt } from '@f3ve/vue-markdown-it';
const post = ref();
onMounted(async () => {
const res = await api.get('/post');
post.value = res.data;
});
</script>
<template>
<vue-markdown-it :source="post" preset="commonmark" />
</template>
一起使用预设和选项
<script setup>
import { VueMarkdownIt } from '@f3ve/vue-markdown-it';
const post = ref();
const options = {
html: true,
linkify: true,
};
onMounted(async () => {
const res = await api.get('/post');
post.value = res.data;
});
</script>
<template>
<vue-markdown-it :source="post" :options="options" preset="commonmark" />
</template>
(单位:千美元)返回顶端(中文(简体) )
路线图
见 未决问题 (c) 列出所有拟议特点(和已知问题).
(单位:千美元)返回顶端(中文(简体) )
捐款
(单位:千美元)返回顶端(中文(简体) )
许可证
分发于 MIT 许可证。 。 。 .
(单位:千美元)返回顶端(中文(简体) )