# Footer

- Page: https://jiguang132.com/resources/ant-design-mobile/docs/footer
- Resource: Ant Design Mobile (https://jiguang132.com/resources/ant-design-mobile.md)
- All guides: https://jiguang132.com/resources/ant-design-mobile/docs.md

## When to Use

## Install

```bash
npm install antd-mobile@5.43.0
```

antd-mobile is for mobile web, not React Native or Mini Programs. React 19 projects must register `createRoot` with `unstableSetRender` at the entry, or imperative APIs such as Toast and Dialog cannot render. Switch dark mode with `<html data-prefers-color-scheme="dark">`.

Examples come from the official Ant Design Mobile repository (MIT) at the commit published as npm 5.43.0. Presentation helpers such as `DemoBlock` are JGuang rewrites, not antd-mobile APIs.

## When to Use

Applicable to information description at the bottom of the page。

## Demos

## Footer

### Props

| Name | Description | Type | Default |
| --- | --- | --- | --- |
| label | Top content with a dividing line | `string \| ReactNode` | - |
| links | Links to content | `LinkItem[]` | - |
| label | The common content section | `string \| ReactNode` | - |
| chips | Chips, only one line of content is allowed. If the content exceeds the width, the content will be automatically intercepted | `ChipItem[]` | - |
| onTagClick | Click the bottom label to trigger, and it will only take effect when the label 'type' is' link ' | `(item: ChipItem, index: number) => void` | - |
| onLinkClick | Clicking the link triggers an event that intercepts the href jump to the A tag | `(item: LinkItem, index: number) => void` | - |

### ChipItem

| Name | Description | Type | Default |
| --- | --- | --- | --- |
| text | Tag Text | `string \| ReactNode` | - |
| type | Tag Type, `plain`is pure display, `link` is clickable | `'plain' \| 'link'` | `'plain'` |

### LinkItem

| Name | Description   | Type     | Default |
| ---- | ------------- | -------- | ------- |
| text | Text of links | `string` | -       |
| href | Href of links | `string` | -       |

### CSS Variables

| Name               | Description | Default                       |
| ------------------ | ----------- | ----------------------------- |
| --background-color | background  | `var(--adm-color-background)` |

---

Index of all JGuang resources: https://jiguang132.com/llms.txt