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(vue): update component usage examples for vue 3 (#22050)

Browse Source
This commit is contained in:
Liam DeBeasi
2020-09-11 13:48:21 -04:00
committed by GitHub
parent 74af3cb50b
commit db2cac20fb
118 changed files with 2647 additions and 544 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
core/src/components/datetime/readme.md
View File

@@ -748,14 +748,15 @@ export class DatetimeExample {
</ion-item>
</template>
<script lang="ts">
import { Component, Vue } from 'vue-property-decorator';
<script>
import { IonDatetime, IonItem, IonLabel } from '@ionic/vue';
import { defineComponent } from 'vue';
@Component()
export default class Example extends Vue {
customYearValues = [2020, 2016, 2008, 2004, 2000, 1996];
customDayShortNames = [
export default defineComponent({
components: { IonDatetime, IonItem, IonLabel },
setup() {
const customYearValues = [2020, 2016, 2008, 2004, 2000, 1996];
const customDayShortNames = [
's\u00f8n',
'man',
'tir',
@@ -764,8 +765,7 @@ export class DatetimeExample {
'fre',
'l\u00f8r'
];
customPickerOptions = {
const customPickerOptions = {
buttons: [{
text: 'Save',
handler: () => console.log('Clicked Save!')
@@ -777,7 +777,14 @@ export class DatetimeExample {
}
}]
}
return {
customYearValues,
customDayShortNames,
customPickerOptions
}
}
});
</script>
```

25
core/src/components/datetime/usage/vue.md
View File

@@ -79,14 +79,15 @@
</ion-item>
</template>
<script lang="ts">
import { Component, Vue } from 'vue-property-decorator';
<script>
import { IonDatetime, IonItem, IonLabel } from '@ionic/vue';
import { defineComponent } from 'vue';
@Component()
export default class Example extends Vue {
customYearValues = [2020, 2016, 2008, 2004, 2000, 1996];
customDayShortNames = [
export default defineComponent({
components: { IonDatetime, IonItem, IonLabel },
setup() {
const customYearValues = [2020, 2016, 2008, 2004, 2000, 1996];
const customDayShortNames = [
's\u00f8n',
'man',
'tir',
@@ -95,8 +96,7 @@
'fre',
'l\u00f8r'
];
customPickerOptions = {
const customPickerOptions = {
buttons: [{
text: 'Save',
handler: () => console.log('Clicked Save!')
@@ -108,6 +108,13 @@
}
}]
}
return {
customYearValues,
customDayShortNames,
customPickerOptions
}
}
});
</script>
```