<template>
  <section class="th-form-title" :class="wrapClass">
    <div class="th-form-title__title">{{ title }}</div>
    <!-- eslint-disable vue/no-v-html -->
    <div v-if="isHtml && content" class="th-form-title__content" v-html="content"></div>
    <div v-if="!isHtml && content" class="th-form-title__content">{{ content }}</div>
  </section>
</template>

<script>
export default {
  name: 'ThFormTitle',
  props: {
    // 标题
    title: {
      type: String,
      default: ''
    },
    // 内容
    content: {
      type: String,
      default: ''
    },
    // 是否以标签显示
    isHtml: {
      type: Boolean,
      default: false
    },
    // 类型
    type: {
      type: String,
      default: ''
    }
  },
  computed: {
    wrapClass() {
      return this.type ? 'th-form-title--' + this.type : ''
    }
  }
}
</script>
