举报投诉联系我们 手机版 热门标签 编程学
您的位置:编程学 > element form rules ElementPlus Result 结果

element form rules ElementPlus Result 结果

2023-05-10 15:18

element form rules ElementPlus Result 结果

element form rules ElementPlus Result 结果

element form rules

Result 结果

用于对用户的操作结果或者异常状态做反馈。

基础用法


<template>
  <el-row>
  <el-col :sm="12" :lg="6">
    <el-result icon="success" title="成功提示" subTitle="请根据提示进行操作">
      <template #extra>
        <el-button type="primary" size="medium">返回</el-button>
      </template>
    </el-result>
  </el-col>
  <el-col :sm="12" :lg="6">
    <el-result icon="warning" title="警告提示" subTitle="请根据提示进行操作">
      <template #extra>
        <el-button type="primary" size="medium">返回</el-button>
      </template>
    </el-result>
  </el-col>
  <el-col :sm="12" :lg="6">
    <el-result icon="error" title="错误提示" subTitle="请根据提示进行操作">
      <template #extra>
        <el-button type="primary" size="medium">返回</el-button>
      </template>
    </el-result>
  </el-col>
  <el-col :sm="12" :lg="6">
    <el-result icon="info" title="信息提示" subTitle="请根据提示进行操作">
      <template #extra>
        <el-button type="primary" size="medium">返回</el-button>
      </template>
    </el-result>
  </el-col>
</el-row>
</template>

自定义内容


<template>
  <el-result title="404" subTitle="抱歉,请求错误">
  <template #icon>
    <el-image
      src="https://img.bianchengxue.com/upload11/2303/105043460.png" rel="external nofollow" 
    ></el-image>
  </template>
  <template #extra>
    <el-button type="primary" size="medium">返回</el-button>
  </template>
</el-result>
</template>

Result Attributes

参数说明类型可选值默认值
title标题string
sub-title二级标题string
icon图标类型stringsuccess / warning / info / errorinfo

Result Slots

Name说明
icon自定义图标
title自定义标题
subTitle自定义二级标题
extra自定义底部额外区域


阅读全文
以上是编程学为你收集整理的element form rules ElementPlus Result 结果全部内容。
声明:本站所有文章资源内容,如无特殊说明或标注,均为采集网络资源。如若本站内容侵犯了原著者的合法权益,可联系本站删除。
相关文章
© 2024 编程学 bianchengxue.com 版权所有 联系我们
桂ICP备19012293号-7 返回底部