App.vue
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 |
<script setup> import { VueMarkdownIt } from '@f3ve/vue-markdown-it'; import { ref } from 'vue'; const post = ref(''); // Function to handle file selection const handleFileUpload = (event) => { const file = event.target.files[0]; if (file) { const fileExtension = file.name.split('.').pop().toLowerCase(); // Check if the file has .md extension if (fileExtension === 'md') { const reader = new FileReader(); reader.onload = () => { post.value = reader.result; // Set the file content as Markdown text }; reader.readAsText(file); // Read the file content as text } else { alert('Please upload a valid .md file.'); } } }; </script> <template> <!-- File input for selecting a .md file --> <input type="file" accept=".md" @change="handleFileUpload" /> <!-- Render the selected Markdown content --> <vue-markdown-it :source="post" /> </template> |
