27 lines
796 B
Vue
27 lines
796 B
Vue
<script setup lang="ts">
|
|
// readonly 可聚焦可复制但不可编辑；disabled 整体灰化不可交互
|
|
import { ref } from 'vue'
|
|
import { G3RichText, G3Segmented, G3Space } from '@g3soft/ui'
|
|
|
|
const mode = ref<'normal' | 'readonly' | 'disabled'>('readonly')
|
|
const html = ref('<p>这是一段<strong>只读</strong>的内容，可以选中复制，但不能编辑。</p>')
|
|
|
|
const options = [
|
|
{ label: '只读', value: 'readonly' },
|
|
{ label: '禁用', value: 'disabled' },
|
|
{ label: '正常', value: 'normal' },
|
|
]
|
|
</script>
|
|
|
|
<template>
|
|
<G3Space vertical :size="12" style="display: flex">
|
|
<G3Segmented v-model="mode" :options="options" />
|
|
|
|
<G3RichText
|
|
v-model="html"
|
|
:readonly="mode === 'readonly'"
|
|
:disabled="mode === 'disabled'"
|
|
/>
|
|
</G3Space>
|
|
</template>
|