富文本 YxRichText

代码演示

<template>
  <YxRichText
      height="300px"
      :imageSize="3"
      v-model:value="values"
      @change="handelChange"
  ></YxRichText>
</template>

<script setup lang="ts">
import {ref} from 'vue'

const values = ref('')

/*模拟延迟加载数据*/
setTimeout(() => {
  values.value = '<h1>测试内容</h1>'
}, 3000)

const handelChange = (value: string) => {
  console.log(value)
  console.log(values.value)
}
</script>

<style scoped lang="less"></style>

API

参数

| 参数 | 说明 | 类型 | 默认值 | |---------------|------------|----------|---------| | v-model:value | 绑定值 | string | | | height | 高度 | string | '500px' | | imageSize | 图片大小限制,单位M | number | 5 |

事件

| 事件名称 | 说明 | 回调参数 | |------|----------------------|-----------------------| | change | 内容改变 | function(value:string) |