javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-09 08:09:32 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore(docs): remove manual documentation (#24984)

Browse Source
This commit is contained in:
Sean Perkins
2022-04-21 12:31:51 -04:00
committed by GitHub
parent 611832b0d5
commit 15c169043f
430 changed files with 1 additions and 68255 deletions
Download Patch File Download Diff File Expand all files Collapse all files

143
core/src/components/infinite-scroll-content/readme.md
View File

@ -1,143 +0,0 @@
# ion-infinite-scroll-content
The `ion-infinite-scroll-content` component is the default child used by the `ion-infinite-scroll`. It displays an infinite scroll spinner that looks best based on the platform and changes the look depending on the infinite scroll's state. The default spinner can be changed and text can be added by setting the `loadingSpinner` and `loadingText` properties.
<!-- Auto Generated Below -->
## Usage
### Angular
```html
<ion-content>
<ion-infinite-scroll>
<ion-infinite-scroll-content
loadingSpinner="bubbles"
loadingText="Loading more data…">
</ion-infinite-scroll-content>
</ion-infinite-scroll>
</ion-content>
```
### Javascript
```html
<ion-content>
<ion-infinite-scroll>
<ion-infinite-scroll-content
loading-spinner="bubbles"
loading-text="Loading more data…">
</ion-infinite-scroll-content>
</ion-infinite-scroll>
</ion-content>
```
### React
```tsx
import React from 'react';
import { IonContent, IonInfiniteScroll, IonInfiniteScrollContent } from '@ionic/react';
export const InfiniteScrollExample: React.FC = () => (
<IonContent>
<IonInfiniteScroll>
<IonInfiniteScrollContent
loadingSpinner="bubbles"
loadingText="Loading more data...">
</IonInfiniteScrollContent>
</IonInfiniteScroll>
</IonContent>
);
```
### Stencil
```tsx
import { Component, h } from '@stencil/core';
@Component({
tag: 'infinite-scroll-content-example',
styleUrl: 'infinite-scroll-content-example.css'
})
export class InfiniteScrollContentExample {
render() {
return [
<ion-content>
<ion-infinite-scroll>
<ion-infinite-scroll-content
loadingSpinner="bubbles"
loadingText="Loading more data...">
</ion-infinite-scroll-content>
</ion-infinite-scroll>
</ion-content>
];
}
}
```
### Vue
```html
<template>
<ion-page>
<ion-content>
<ion-infinite-scroll>
<ion-infinite-scroll-content
loading-spinner="bubbles"
loading-text="Loading more data…">
</ion-infinite-scroll-content>
</ion-infinite-scroll>
</ion-content>
</ion-page>
</template>
<script lang="ts">
import {
IonContent,
IonInfiniteScroll,
IonInfiniteScrollContent,
IonPage
} from '@ionic/vue';
import { defineComponent } from 'vue';
export default defineComponent({
components: {
IonContent,
IonInfiniteScroll,
IonInfiniteScrollContent,
IonPage
}
});
```
## Properties
| Property | Attribute | Description | Type | Default |
| ---------------- | ----------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
| `loadingSpinner` | `loading-spinner` | An animated SVG spinner that shows while loading. | `"bubbles" \| "circles" \| "circular" \| "crescent" \| "dots" \| "lines" \| "lines-sharp" \| "lines-sharp-small" \| "lines-small" \| null \| undefined` | `undefined` |
| `loadingText` | `loading-text` | Optional text to display while loading. `loadingText` can accept either plaintext or HTML as a string. To display characters normally reserved for HTML, they must be escaped. For example `<Ionic>` would become `&lt;Ionic&gt;` For more information: [Security Documentation](https://ionicframework.com/docs/faq/security) | `IonicSafeString \| string \| undefined` | `undefined` |
## Dependencies
### Depends on
- [ion-spinner](../spinner)
### Graph
```mermaid
graph TD;
ion-infinite-scroll-content --> ion-spinner
style ion-infinite-scroll-content fill:#f9f,stroke:#333,stroke-width:4px
```
----------------------------------------------
*Built with [StencilJS](https://stenciljs.com/)*

10
core/src/components/infinite-scroll-content/usage/angular.md
View File

@ -1,10 +0,0 @@
```html
<ion-content>
<ion-infinite-scroll>
<ion-infinite-scroll-content
loadingSpinner="bubbles"
loadingText="Loading more data…">
</ion-infinite-scroll-content>
</ion-infinite-scroll>
</ion-content>
```

10
core/src/components/infinite-scroll-content/usage/javascript.md
View File

@ -1,10 +0,0 @@
```html
<ion-content>
<ion-infinite-scroll>
<ion-infinite-scroll-content
loading-spinner="bubbles"
loading-text="Loading more data…">
</ion-infinite-scroll-content>
</ion-infinite-scroll>
</ion-content>
```

15
core/src/components/infinite-scroll-content/usage/react.md
View File

@ -1,15 +0,0 @@
```tsx
import React from 'react';
import { IonContent, IonInfiniteScroll, IonInfiniteScrollContent } from '@ionic/react';
export const InfiniteScrollExample: React.FC = () => (
<IonContent>
<IonInfiniteScroll>
<IonInfiniteScrollContent
loadingSpinner="bubbles"
loadingText="Loading more data...">
</IonInfiniteScrollContent>
</IonInfiniteScroll>
</IonContent>
);
```

22
core/src/components/infinite-scroll-content/usage/stencil.md
View File

@ -1,22 +0,0 @@
```tsx
import { Component, h } from '@stencil/core';
@Component({
tag: 'infinite-scroll-content-example',
styleUrl: 'infinite-scroll-content-example.css'
})
export class InfiniteScrollContentExample {
render() {
return [
<ion-content>
<ion-infinite-scroll>
<ion-infinite-scroll-content
loadingSpinner="bubbles"
loadingText="Loading more data...">
</ion-infinite-scroll-content>
</ion-infinite-scroll>
</ion-content>
];
}
}
```

32
core/src/components/infinite-scroll-content/usage/vue.md
View File

@ -1,32 +0,0 @@
```html
<template>
<ion-page>
<ion-content>
<ion-infinite-scroll>
<ion-infinite-scroll-content
loading-spinner="bubbles"
loading-text="Loading more data…">
</ion-infinite-scroll-content>
</ion-infinite-scroll>
</ion-content>
</ion-page>
</template>
<script lang="ts">
import {
IonContent,
IonInfiniteScroll,
IonInfiniteScrollContent,
IonPage
} from '@ionic/vue';
import { defineComponent } from 'vue';
export default defineComponent({
components: {
IonContent,
IonInfiniteScroll,
IonInfiniteScrollContent,
IonPage
}
});
```