二十、分页效果实现二十一、知识文章新增弹窗编写ArticleDialog.vue组件template el-dialog title文章详情 v-modeldialogVisible width50% closehandleClose el-form :modelformData :rulesrules refformRef label-width120px el-form-item label文章标题 proptitle el-input v-modelformData.title placeholder请输入文章标题 maxlength200 show-word-limit clearable / /el-form-item /el-form /el-dialog /template script setup import { reactive, ref, computed } from vue const props defineProps({ modelValue: { type: Boolean, default: false } }) const formData reactive({ title: , content: , coverImage: , categoryId: 0, summary: , tags: , id: }) const rules reactive({ title: [ { required: true, message: 请输入文章标题, trigger: blur }, { max: 50, message: 文章标题最多50个字符, trigger: blur } ], }) const emit defineEmits([update:modelValue]) const dialogVisible computed({ get(){ return props.modelValue }, set(val){ emit(update:modelValue,val) } }) const handleClose () {} /script引入组件