mirror of
https://github.com/CorentinTh/it-tools
synced 2025-12-14 07:06:04 +00:00
feat(new-tool): html wysiwyg editor
This commit is contained in:
committed by
Corentin THOMASSET
parent
b1d6bfd2dc
commit
f3b1863f09
17
src/tools/html-wysiwyg-editor/html-wysiwyg-editor.vue
Normal file
17
src/tools/html-wysiwyg-editor/html-wysiwyg-editor.vue
Normal file
@@ -0,0 +1,17 @@
|
||||
<template>
|
||||
<editor v-model:html="html" />
|
||||
<textarea-copyable :value="format(html, { parser: 'html', plugins: [htmlParser] })" language="html" />
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import TextareaCopyable from '@/components/TextareaCopyable.vue';
|
||||
import { ref } from 'vue';
|
||||
import { format } from 'prettier';
|
||||
import htmlParser from 'prettier/parser-html';
|
||||
import { useStorage } from '@vueuse/core';
|
||||
import Editor from './editor/editor.vue';
|
||||
|
||||
const html = useStorage('html-wysiwyg-editor--html', '<h1>Hey!</h1><p>Welcome to this html wysiwyg editor</p>');
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
Reference in New Issue
Block a user