<script setup>
const form = ref(null)
const model = ref({
  content: ''
})
const rules = ref({
  content: {
    type: 'string',
    required: true,
    message: '请输入反馈内容',
    trigger: ['change']
  }
})

const submit = () => {
  // 如果有错误，会在catch中返回报错信息数组，校验通过则在then中返回true
  form.value
    .validate()
    .then((res) => {
      console.log(res)
      uni.$u.toast('校验通过')
    })
    .catch((errors) => {
      console.log(errors)
      uni.$u.toast('校验失败')
    })
}
</script>

<template>
  <view min-h-100vh px-30>
    <up-form
      ref="form"
      label-width="80"
      label-position="top"
      :model="model"
      :rules="rules"
    >
      <up-form-item label="反馈内容：" prop="content" :border="`${'none'}`">
        <up-textarea
          v-model="model.content"
          placeholder="请输入反馈内容"
          maxlength="300"
          count
          height="150"
        />
      </up-form-item>
    </up-form>

    <up-button
      type="primary"
      text="提交"
      custom-style="margin-top: 30px"
      @click="submit"
    />
  </view>
</template>
