Ionic-4 ion-alert-controller 创建功能不起作用

Question

我正在使用 Ionic 和 vanila java 脚本我在头组件中使用 CDN

<script type="module" src="https://cdn.jsdelivr.net/npm/@ionic/core/dist/ionic/ionic.esm.js"></script>
<script nomodule src="https://cdn.jsdelivr.net/npm/@ionic/core/dist/ionic/ionic.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ionic/core/css/ionic.bundle.css"/>

在HTML

的正文中

<ion-alert-controller></ion-alert-controller>
......
.....
<script src="app.js"></script>

在app.js

const alertCtrl = document.querySelector('ion-alert-controller');
..
..
..
alertCtrl.create ({
                message: 'ABC',
                header: 'DEF',
                button: ['Okay']
            });

收到一条错误提示

app.js:29 未捕获类型错误：alertCtrl.create 不是函数在 HTML 元素处。 (app.js:29)

Answer 1

我不习惯用 vanilla 编写代码，但根据 Ionic docs for js，你应该这样使用 alertController :

const alertCtrl = document.querySelector('ion-alert-controller');
alertCtrl.message ='ABC';
alertCtrl.header='DEF';
alertCtrl.button= ['OK'];

Answer 2

我遇到了同样的情况。您使用的 ionic CDN 将下载最新版本的 ionic，但我猜 ion-alert-controller 指令是 ionic 4.

你需要使用

<link href="https://unpkg.com/@ionic/core@4.0.2/css/ionic.bundle.css" rel="stylesheet">
<script src="https://unpkg.com/@ionic/core@4.0.2/dist/ionic.js"></script>

请注意，上面的链接指的是 unpkg.com，而不是 jsdelivr.net

请参考

https://unpkg.com/browse/@ionic/core@4.1.0-dev.201902272232.d66b12b/README.md

第 26 和 27 行

Ionic-4 ion-alert-controller 创建功能不起作用

Ionic-4 ion-alert-controller create function not working

javascript

ionic-framework

ionic4