forked from opentiny/tiny-vue
64 lines
1.3 KiB
Vue
64 lines
1.3 KiB
Vue
<template>
|
||
<div>
|
||
<tiny-fluent-editor v-model="content" :options="options"></tiny-fluent-editor>
|
||
内容：<br />
|
||
{{ content }}
|
||
</div>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref } from 'vue'
|
||
import { TinyFluentEditor } from '@opentiny/vue'
|
||
|
||
const content = ref('')
|
||
const options = ref({
|
||
placeholder: '请输入内容',
|
||
modules: {
|
||
// 工具栏
|
||
toolbar: [
|
||
['bold', 'italic', 'underline', 'strike'],
|
||
[{ list: 'bullet' }, { list: 'ordered' }],
|
||
[{ align: '' }, { align: 'center' }, { align: 'right' }],
|
||
['better-table'],
|
||
['fullscreen']
|
||
],
|
||
// 字数统计
|
||
counter: true,
|
||
// 表格
|
||
'better-table': {
|
||
operationMenu: {
|
||
color: {
|
||
text: '主题色',
|
||
colors: [
|
||
'#ffffff',
|
||
'#f2f2f2',
|
||
'#dddddd',
|
||
'#a6a6a6',
|
||
'#666666',
|
||
'#000000',
|
||
'#c00000',
|
||
'#ff0000',
|
||
'#ffc8d3',
|
||
'#ffc000',
|
||
'#ffff00',
|
||
'#fff4cb',
|
||
'#92d050',
|
||
'#00b050',
|
||
'#dff3d2',
|
||
'#00b0f0',
|
||
'#0070c0',
|
||
'#d4f1f5',
|
||
'#002060',
|
||
'#7030a0',
|
||
'#7b69ee',
|
||
'#1476ff',
|
||
'#ec66ab',
|
||
'#42b883'
|
||
]
|
||
}
|
||
}
|
||
}
|
||
}
|
||
})
|
||
</script>
|