amis/docs/zh-CN/components/remark.md

115 lines
2.1 KiB
Markdown
Raw Normal View History

2020-07-28 10:03:53 +08:00
---
title: Remark 标记
2020-10-12 12:46:20 +08:00
description:
2020-07-28 10:03:53 +08:00
type: 0
group: ⚙ 组件
menuName: Remark
2020-10-12 12:46:20 +08:00
icon:
2020-07-28 10:03:53 +08:00
order: 62
---
2020-10-12 12:46:20 +08:00
用于展示提示文本,和表单项中的 remark 属性类型。
2020-07-28 10:03:53 +08:00
## 基本用法
```schema
2020-07-28 10:03:53 +08:00
{
"type": "page",
"body": {
"type": "remark",
"content": "这是一段提醒"
}
}
```
## 图标形状
```schema
{
"type": "page",
"body": {
"type": "remark",
"content": "这是一段提醒",
"shape": "circle"
}
}
```
2020-07-28 10:03:53 +08:00
## 可配置标题
```schema
2020-07-28 10:03:53 +08:00
{
"type": "page",
"body": {
"type": "remark",
"content": {
"title": "标题",
"body": "这是一段提醒"
}
}
}
```
## 支持变量
```schema
{
"type": "page",
"data": {
"github": "https://github.com/"
},
"body": [
{
"type": "remark",
"content": "${github}"
},
{
"type": "remark",
"content": {
"title": "${github|raw}",
"body": "${github}"
}
}
]
}
```
2020-07-28 10:03:53 +08:00
## 弹出位置
```schema: scope="body"
2020-07-28 10:03:53 +08:00
[
{
"type": "remark",
"content": "向上",
"placement": "top"
},
{
"type": "remark",
"content": "向下",
"placement": "bottom"
},
{
"type": "remark",
"content": "向左",
"placement": "left"
},
{
"type": "remark",
"content": "向右",
"placement": "right"
}
]
```
## 属性表
| 属性名 | 类型 | 默认值 | 说明 |
| --------- | -------- | ----------------------- | ------------- |
| type | `string` | | `remark` |
| className | `string` | | 外层 CSS 类名 |
| content | `string` | | 提示文本 |
| placement | `string` | | 弹出位置 |
| trigger | `string` | `['hover', 'focus']` | 触发条件 |
| icon | `string` | `fa fa-question-circle` | 图标 |
| shape | `'circle' \| 'square'` | 图标形状 |