javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

docs(loading): update usage to fix code errors (#20330)

Browse Source 
closes ionic-team/ionic-docs#1200
This commit is contained in:
Brandy Carney
2020-01-29 14:24:22 -05:00
committed by GitHub
parent eb57723785
commit 6b2f6618f6
5 changed files with 58 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
core/src/components/loading/readme.md
View File

@@ -34,13 +34,12 @@ export class LoadingExample {
async presentLoading() {
const loading = await this.loadingController.create({
message: 'Hellooo',
message: 'Please wait...',
duration: 2000
});
await loading.present();
const { role, data } = await loading.onDidDismiss();
console.log('Loading dismissed!');
}
@@ -48,11 +47,15 @@ export class LoadingExample {
const loading = await this.loadingController.create({
spinner: null,
duration: 5000,
message: 'Please wait...',
message: 'Click the backdrop to dismiss early...',
translucent: true,
cssClass: 'custom-class custom-loading'
cssClass: 'custom-class custom-loading',
backdropDismiss: true
});
return await loading.present();
await loading.present();
const { role, data } = await loading.onDidDismiss();
console.log('Loading dismissed with role:', role);
}
}
```
@@ -63,27 +66,31 @@ export class LoadingExample {
```javascript
async function presentLoading() {
const loading = document.createElement('ion-loading');
loading.message: 'Hellooo',
loading.duration: 2000;
loading.message = 'Please wait...';
loading.duration = 2000;
document.body.appendChild(loading);
await loading.present();
const { role, data } = await loading.onDidDismiss();
console.log('Loading dismissed!');
}
function presentLoadingWithOptions() {
async function presentLoadingWithOptions() {
const loading = document.createElement('ion-loading');
loading.spinner = null;
loading.duration = 5000;
loading.message = 'Please wait...';
loading.message = 'Click the backdrop to dismiss early...';
loading.translucent = true;
loading.cssClass = 'custom-class custom-loading';
loading.backdropDismiss = true;
document.body.appendChild(loading);
return loading.present();
await loading.present();
const { role, data } = await loading.onDidDismiss();
console.log('Loading dismissed with role:', role);
}
```
@@ -107,7 +114,7 @@ export const LoadingExample: React.FC = () => {
<IonLoading
isOpen={showLoading}
onDidDismiss={() => setShowLoading(false)}
message={'Loading...'}
message={'Please wait...'}
duration={5000}
/>
</IonContent>
@@ -136,14 +143,14 @@ export default {
presentLoading() {
return this.$ionic.loadingController
.create({
message: 'Loading',
message: 'Please wait...',
duration: this.timeout,
})
.then(l => {
.then(loading => {
setTimeout(function() {
l.dismiss()
loading.dismiss()
}, this.timeout)
return l.present()
return loading.present()
})
},
presentLoadingWithOptions() {
@@ -151,15 +158,16 @@ export default {
.create({
spinner: null,
duration: this.timeout,
message: 'Please wait...',
message: 'Click the backdrop to dismiss early...',
translucent: true,
cssClass: 'custom-class custom-loading',
backdropDismiss: true
})
.then(l => {
.then(loading=> {
setTimeout(function() {
l.dismiss()
loading.dismiss()
}, this.timeout)
return l.present()
return loading.present()
})
},
},

15
core/src/components/loading/usage/angular.md
View File

@@ -12,13 +12,12 @@ export class LoadingExample {
async presentLoading() {
const loading = await this.loadingController.create({
message: 'Hellooo',
message: 'Please wait...',
duration: 2000
});
await loading.present();
const { role, data } = await loading.onDidDismiss();
console.log('Loading dismissed!');
}
@@ -26,11 +25,15 @@ export class LoadingExample {
const loading = await this.loadingController.create({
spinner: null,
duration: 5000,
message: 'Please wait...',
message: 'Click the backdrop to dismiss early...',
translucent: true,
cssClass: 'custom-class custom-loading'
cssClass: 'custom-class custom-loading',
backdropDismiss: true
});
return await loading.present();
await loading.present();
const { role, data } = await loading.onDidDismiss();
console.log('Loading dismissed with role:', role);
}
}
```

16
core/src/components/loading/usage/javascript.md
View File

@@ -1,26 +1,30 @@
```javascript
async function presentLoading() {
const loading = document.createElement('ion-loading');
loading.message: 'Hellooo',
loading.duration: 2000;
loading.message = 'Please wait...';
loading.duration = 2000;
document.body.appendChild(loading);
await loading.present();
const { role, data } = await loading.onDidDismiss();
console.log('Loading dismissed!');
}
function presentLoadingWithOptions() {
async function presentLoadingWithOptions() {
const loading = document.createElement('ion-loading');
loading.spinner = null;
loading.duration = 5000;
loading.message = 'Please wait...';
loading.message = 'Click the backdrop to dismiss early...';
loading.translucent = true;
loading.cssClass = 'custom-class custom-loading';
loading.backdropDismiss = true;
document.body.appendChild(loading);
return loading.present();
await loading.present();
const { role, data } = await loading.onDidDismiss();
console.log('Loading dismissed with role:', role);
}
```

2
core/src/components/loading/usage/react.md
View File

@@ -15,7 +15,7 @@ export const LoadingExample: React.FC = () => {
<IonLoading
isOpen={showLoading}
onDidDismiss={() => setShowLoading(false)}
message={'Loading...'}
message={'Please wait...'}
duration={5000}
/>
</IonContent>

17
core/src/components/loading/usage/vue.md
View File

@@ -16,14 +16,14 @@ export default {
presentLoading() {
return this.$ionic.loadingController
.create({
message: 'Loading',
message: 'Please wait...',
duration: this.timeout,
})
.then(l => {
.then(loading => {
setTimeout(function() {
l.dismiss()
loading.dismiss()
}, this.timeout)
return l.present()
return loading.present()
})
},
presentLoadingWithOptions() {
@@ -31,15 +31,16 @@ export default {
.create({
spinner: null,
duration: this.timeout,
message: 'Please wait...',
message: 'Click the backdrop to dismiss early...',
translucent: true,
cssClass: 'custom-class custom-loading',
backdropDismiss: true
})
.then(l => {
.then(loading=> {
setTimeout(function() {
l.dismiss()
loading.dismiss()
}, this.timeout)
return l.present()
return loading.present()
})
},
},