Ionic 如何使用vuews获得离子警报输入响应

mbyulnm0 于 2022-12-09 发布在 Ionic

关注(0)|答案(1)|浏览(168)

I am new to Ionic. I want to get ionic-alert inputs values after pressing ok button as shown in the image bellow.

I tried using the following code :

async presentAlertPrompt() {
    const alert = await alertController
    .create({
        cssClass: 'my-custom-class',
        header: 'Confirmation',
        inputs: [
        {
            name: 'note',
            value: '',
            placeholder: 'Note desciptive',
        },
        {
            name: 'quantity',
            type: 'number',
            value: '',
            min: 1,
            label: 'Quanité',
            placeholder: 'Quanité'
        },
        {
            name: 'custome_price',
            type: 'number',
            value: '',
            min: 0,
            label: 'Prix à discuter',
            placeholder: 'Prix à discuter',
        },
        {
            name: 'customer',
            placeholder: 'Nom du client',
            value: '',
        },
        {
            name: 'phone',
            type: 'phone',
            placeholder: 'Téléphone du client',
            value: '',
        },
        ],
        buttons: [
        {
            text: 'Annuler',
            role: 'cancel',
            cssClass: 'secondary',
            handler: () => {
            console.log('Confirm Cancel')
            },
        },
        {
            text: 'Ok',
            handler: () => {
            console.log('Confirm Ok  ')
            },
        },
        ],
    });
    return alert.present();
},

But when I call this method from another method I get promise object instead of input values :

onSelling(){
    const confirm = this.presentAlertPrompt()
    console.log('confirm >>>>>>>>>> : ', confirm)
    //this.getCurrentPosition()
},

confirm >>>>>>>>>> : Promise { : "pending" } : "fulfilled" : undefined : Promise.prototype { … }
I also tried to use then and Async Await but I get undefined .

onSelling(){
    this.presentAlertPrompt().then((res) => {
        console.log('res ->>>>>>>>>>>>>>> ', res)
    },
    (err) => {
        console.log('err ->>>>>>>>>>>>>>> ', err)
    })
},

ionic-framework

来源：https://stackoverflow.com/questions/71449879/how-to-get-ionic-ion-alert-inputs-response-using-vuejs

1条答案

按热度按时间

ef1yzkbh1#

您可以接收.then((response) => {}) promisse中的所有数据或等待返回。一个名为"data"的属性将包含所有填写的表单。

export default defineComponent({
    name: "ComponentExample",
    methods: {
        async openAlertController(){
            const alert = await alertController.create({
                header: 'Insert your link here:',
                buttons: [
                    {
                        text: 'Cancel',
                        role: 'cancel'
                    },
                    {
                        text: 'OK',
                        role: 'confirm',
                    }
                ],
                inputs: [
                    {
                        placeholder: 'Type the url',
                    }
                ]
            });
            
            await alert.present();
            
            const result = await alert.onDidDismiss();
            const resultData = result.data;
            console.log(resultData)
        }
    }
});

控制台将输出所有数据。

赞(0）回复(0）举报 2022-12-09

我来回答

Ionic 如何使用vuews获得离子警报输入响应

1条答案

相关问题

热门标签

最新问答