<!--
 * @Description: form 表单下的文本显示
-->
<template>
  <div v-bind="attrs">
    <span class="ant-form-text" :title="title">{{ state }}</span>
  </div>
</template>
<script lang="ts">
  import { defineComponent } from 'vue';
  import { useAttrs } from '/@/hooks/core/useAttrs';
  import { useRuleFormItem } from '/@/hooks/component/useFormItem';
  export default defineComponent({
    name: 'PlainText',
    props: {
      value: {
        type: [String, Number],
        default: '',
      },
    },
    setup(props) {
      const attrs = useAttrs();
      const [state] = useRuleFormItem(props);
      const title = state.value?.toString() ?? '';
      return { attrs, state, title };
    },
  });
</script>
<style lang="less" scoped>
  .text-editor {
    display: flex;
  }
</style>
