2023-03-07 18:44:39 +08:00
|
|
|
|
<template>
|
2023-03-10 22:02:19 +08:00
|
|
|
|
<mavon-editor
|
2023-03-12 01:50:11 +08:00
|
|
|
|
:v-model="text"
|
2023-03-10 22:02:19 +08:00
|
|
|
|
:subfield="subfield"
|
|
|
|
|
|
:codeStyle="props.codeStyle"
|
|
|
|
|
|
:ishljs="true"
|
2023-03-11 01:16:28 +08:00
|
|
|
|
:style="{minHeight:props.height,maxHeight:'100%'}"
|
2023-03-10 22:02:19 +08:00
|
|
|
|
class="edit"
|
|
|
|
|
|
@change="change"
|
|
|
|
|
|
></mavon-editor>
|
2023-03-07 18:44:39 +08:00
|
|
|
|
</template>
|
2023-03-10 22:02:19 +08:00
|
|
|
|
<script setup>
|
|
|
|
|
|
// Local Registration
|
2023-03-12 01:50:11 +08:00
|
|
|
|
|
2023-03-10 22:02:19 +08:00
|
|
|
|
import { mavonEditor } from 'mavon-editor'
|
|
|
|
|
|
import 'mavon-editor/dist/css/index.css'
|
2023-03-12 01:50:11 +08:00
|
|
|
|
import { ref,computed,watch } from 'vue';
|
2023-03-10 22:02:19 +08:00
|
|
|
|
const props = defineProps(['height','modelValue',"codeStyle"])
|
|
|
|
|
|
const emit=defineEmits(['update:modelValue'])
|
|
|
|
|
|
const subfield = true;
|
2023-03-12 01:50:11 +08:00
|
|
|
|
|
|
|
|
|
|
//v-model传值出去
|
|
|
|
|
|
const text = computed({
|
|
|
|
|
|
get() {
|
|
|
|
|
|
return props.modelValue
|
|
|
|
|
|
},
|
|
|
|
|
|
set(value) {
|
|
|
|
|
|
emit('update:modelValue', value)
|
|
|
|
|
|
}
|
|
|
|
|
|
})
|
|
|
|
|
|
|
2023-03-10 22:02:19 +08:00
|
|
|
|
const change=(value ,render)=>
|
|
|
|
|
|
{
|
2023-03-12 01:50:11 +08:00
|
|
|
|
console.log(value,"value");
|
|
|
|
|
|
//不用给解析后htm的值,给value即可
|
|
|
|
|
|
emit('update:modelValue', value)
|
2023-03-10 22:02:19 +08:00
|
|
|
|
}
|
2023-03-07 18:44:39 +08:00
|
|
|
|
|
2023-03-10 22:02:19 +08:00
|
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|
|
|
|
|
|
.edit
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
}
|
|
|
|
|
|
</style>
|