ionic-framework 相关问题

Ionic是一个前端框架,用于使用Sass和Angular开发具有HTML的本机感混合移动应用程序。默认情况下,它运行在Cordova之上。

如何在 Ionic 7 中将状态传递给 IonRouterLink?

我正在使用 ionic 7 和 React 18。我有这个路由器链接 routerLink='/联系人' style={{ 颜色: '蓝色', 光标: '指针', marginLeft: '4px' }} > 怎么会...

回答 1 投票 0

如何将 ionic 应用程序作为网站托管在服务器上

我使用 ionic 和 Cordova 创建了 Android 移动应用程序。现在我需要将此应用程序作为网站托管。我对托管网络应用程序没有任何了解。请帮忙。

回答 3 投票 0

FCM 成功,但 Ionic V1 中的设备未收到通知

我正在将 FIREBASE CLOUD MESSAGING 服务与我的 ionic 产品和phonegap-plugin-push cordova 插件一起使用,以从 PHP 后端获取推送通知。 当我尝试获取推送通知时...

回答 2 投票 0

如何在 Ionic 7 中像 Google Photos 一样从底部打开菜单

我需要根据底部手势打开菜单,如下图GIF所示。 这是我能够实现的目标:Stackblitz 我需要根据底部手势打开菜单,如下图 GIF 所示。 这是我能够实现的目标:Stackblitz <template> <ion-menu content-id="main-content"> <ion-header> <ion-toolbar> <ion-title>Menu Content</ion-title> </ion-toolbar> </ion-header> <ion-content class="ion-padding"> <ion-menu-toggle> <ion-button>Click to close the menu</ion-button> </ion-menu-toggle> </ion-content> </ion-menu> <ion-page id="main-content"> <ion-header> <ion-toolbar> <ion-title>Menu</ion-title> </ion-toolbar> </ion-header> <ion-content class="ion-padding"> <ion-menu-toggle> <ion-button>Click to open the menu</ion-button> </ion-menu-toggle> </ion-content> </ion-page> </template> <script lang="ts"> import { IonButton, IonContent, IonHeader, IonMenu, IonMenuToggle, IonPage, IonTitle, IonToolbar } from '@ionic/vue'; import { defineComponent } from 'vue'; export default defineComponent({ components: { IonButton, IonContent, IonHeader, IonMenu, IonMenuToggle, IonPage, IonTitle, IonToolbar, }, }); </script> 您可以使用离子片模态文档: <template> <ion-header> <ion-toolbar> <ion-title>App</ion-title> </ion-toolbar> </ion-header> <ion-content class="ion-padding"> <ion-button id="open-modal" expand="block">Open Sheet Modal</ion-button> <ion-modal ref="modal" trigger="open-modal" :initial-breakpoint="0.25" :breakpoints="[0, 0.25, 0.5, 0.75]"> <ion-content class="ion-padding"> <ion-searchbar @click="$refs.modal.$el.setCurrentBreakpoint(0.75)" placeholder="Search"></ion-searchbar> <ion-list> <ion-item> <ion-avatar slot="start"> <ion-img src="https://i.pravatar.cc/300?u=b"></ion-img> </ion-avatar> <ion-label> <h2>Connor Smith</h2> <p>Sales Rep</p> </ion-label> </ion-item> <ion-item> <ion-avatar slot="start"> <ion-img src="https://i.pravatar.cc/300?u=a"></ion-img> </ion-avatar> <ion-label> <h2>Daniel Smith</h2> <p>Product Designer</p> </ion-label> </ion-item> <ion-item> <ion-avatar slot="start"> <ion-img src="https://i.pravatar.cc/300?u=d"></ion-img> </ion-avatar> <ion-label> <h2>Greg Smith</h2> <p>Director of Operations</p> </ion-label> </ion-item> <ion-item> <ion-avatar slot="start"> <ion-img src="https://i.pravatar.cc/300?u=e"></ion-img> </ion-avatar> <ion-label> <h2>Zoey Smith</h2> <p>CEO</p> </ion-label> </ion-item> </ion-list> </ion-content> </ion-modal> </ion-content> </template> <script lang="ts" setup> import { IonButton, IonModal, IonHeader, IonContent, IonToolbar, IonTitle, IonItem, IonList, IonAvatar, IonImg, IonLabel, IonSearchbar, } from '@ionic/vue'; </script>

回答 1 投票 0

在严格执行 npx cap add android 后如何修复此错误?

运行“npm install @capacitor/android”后,我执行了“npx cap add android”,但它给了我以下错误: npm 错误!无法确定要运行的可执行文件 节点版本:v20...

回答 1 投票 0

如何从底部打开菜单,就像 ionic 7 中的谷歌照片一样

嗨,我需要根据底部手势打开菜单,如下图 GIF 所示。 这是我能够实现的目标:Stackblitz 嗨,我需要根据底部手势打开菜单,如下图 GIF 所示。 这是我能够实现的目标:Stackblitz <template> <ion-menu content-id="main-content"> <ion-header> <ion-toolbar> <ion-title>Menu Content</ion-title> </ion-toolbar> </ion-header> <ion-content class="ion-padding"> <ion-menu-toggle> <ion-button>Click to close the menu</ion-button> </ion-menu-toggle> </ion-content> </ion-menu> <ion-page id="main-content"> <ion-header> <ion-toolbar> <ion-title>Menu</ion-title> </ion-toolbar> </ion-header> <ion-content class="ion-padding"> <ion-menu-toggle> <ion-button>Click to open the menu</ion-button> </ion-menu-toggle> </ion-content> </ion-page> </template> <script lang="ts"> import { IonButton, IonContent, IonHeader, IonMenu, IonMenuToggle, IonPage, IonTitle, IonToolbar } from '@ionic/vue'; import { defineComponent } from 'vue'; export default defineComponent({ components: { IonButton, IonContent, IonHeader, IonMenu, IonMenuToggle, IonPage, IonTitle, IonToolbar, }, }); </script> 请帮助我提前致谢! 您可以使用离子片模态文档: <template> <ion-header> <ion-toolbar> <ion-title>App</ion-title> </ion-toolbar> </ion-header> <ion-content class="ion-padding"> <ion-button id="open-modal" expand="block">Open Sheet Modal</ion-button> <ion-modal ref="modal" trigger="open-modal" :initial-breakpoint="0.25" :breakpoints="[0, 0.25, 0.5, 0.75]"> <ion-content class="ion-padding"> <ion-searchbar @click="$refs.modal.$el.setCurrentBreakpoint(0.75)" placeholder="Search"></ion-searchbar> <ion-list> <ion-item> <ion-avatar slot="start"> <ion-img src="https://i.pravatar.cc/300?u=b"></ion-img> </ion-avatar> <ion-label> <h2>Connor Smith</h2> <p>Sales Rep</p> </ion-label> </ion-item> <ion-item> <ion-avatar slot="start"> <ion-img src="https://i.pravatar.cc/300?u=a"></ion-img> </ion-avatar> <ion-label> <h2>Daniel Smith</h2> <p>Product Designer</p> </ion-label> </ion-item> <ion-item> <ion-avatar slot="start"> <ion-img src="https://i.pravatar.cc/300?u=d"></ion-img> </ion-avatar> <ion-label> <h2>Greg Smith</h2> <p>Director of Operations</p> </ion-label> </ion-item> <ion-item> <ion-avatar slot="start"> <ion-img src="https://i.pravatar.cc/300?u=e"></ion-img> </ion-avatar> <ion-label> <h2>Zoey Smith</h2> <p>CEO</p> </ion-label> </ion-item> </ion-list> </ion-content> </ion-modal> </ion-content> </template> <script lang="ts" setup> import { IonButton, IonModal, IonHeader, IonContent, IonToolbar, IonTitle, IonItem, IonList, IonAvatar, IonImg, IonLabel, IonSearchbar, } from '@ionic/vue'; </script>

回答 1 投票 0

ionic Cordova 和 OneSignal 的问题

请帮助我!我尝试使用 OneSignal 输入推送通知,但没有成功。当我在 xCode 日志中向我的应用程序发送文本时,它会显示以下内容: 警告:安装 OneSignal 插件:'ionic cordova

回答 2 投票 0

将 OnActivityResult 数据从电容器传递回混合应用程序

我正在开发一个 Compacitor 混合应用程序。我正在尝试按照此页面中的说明进行操作:https://capacitor.ionicframework.com/docs/plugins/android ,以 startActivityForResult (来自混合 javascript...

回答 3 投票 0

在 Typescript Ionic 项目中包含 Javascript 文件

这花了我几个小时来解决,并且我阅读了很多过时的帖子,所以我发布了一个新问题。 如何使用 d.ts 文件在 Ionic 项目中添加和导入 javascript 文件?

回答 1 投票 0

Angular:为什么我得到一个 Observable 作为响应

我得到了一个意外的 Observable(随机)作为响应 res(预期结果是一个对象数组): this.api[op.type](op.endpoint,op.body, op.token).pipe( 取(1), ...

回答 1 投票 0

如何使用 @angular/fire 17 和 ionic @ionic/Angular 7.6.2 配置 firestore 以完全离线工作?

我对使用 Angular ionic 和 Firebase 进行严肃的应用程序开发还比较陌生。 我现在正在尝试弄清楚如何使用 Angular Fire 配置离线功能/无限缓存大小,持续了几天......

回答 1 投票 0

Capacitor Community Admob - 无广告显示 - 测试 IOS 广告不显示

我正在使用 Capacitor Community AdMob (v5.3.1) 在 Android 和 IOS 应用程序上显示横幅和插页式广告。我将 Angular 与 Ionic Framework 一起使用 - 代码库是相同的,除了“nati...

回答 1 投票 0

Ionic + Cordova Android 构建错误 - 找不到tools.jar

今天我已将 MacBook 升级到 macOS Big Sur 版本 11.0.1。现在,当我尝试为 Android 构建项目时出现了问题。 任务 ':CordovaLib:

回答 7 投票 0

即使内容没有溢出,离子内容也会创建滚动条

在我的页面中,我有一个简单的表单,可能会在某些视图中溢出,离子内容显示滚动条并使页面可滚动,即使表单没有溢出。 事实上,该页面...

回答 1 投票 0

找不到“@types”的类型定义文件

所以我正在为 android 和 ios 设备构建一个 ionic 应用程序。 当我尝试使用命令“ionic cordova build android --prod --release”在 android 中构建应用程序时,它在(

回答 4 投票 0

XCode 部署到真实设备时出错:操作无法完成。 (操作系统状态错误-10814。)

尝试使用我的 Macbook Pro M2 部署到真实的 IOS 设备时出现以下错误: 我在 VPN 和设备中找不到任何“选择您的开发者应用程序证书”选项

回答 1 投票 0

接口“HTMLIonIconElement”无法同时扩展类型“IonIc on”和“HTMLStencilElement”

我刚刚通过运行 ng update 将我的 Angular ionic 应用程序升级为使用 Angular 12 中的 Angular v13。更新成功,但现在我无法运行该应用程序,并出现以下错误 [ng] 错误:node_mo...

回答 3 投票 0

为 ion-toast 组件和阴影部分的按钮应用不同的样式

我正在使用 Ionic 创建一个应用程序,并且正在使用带有两个按钮的 toast 组件。 我必须为每个按钮创建不同的样式。 我的代码是这样的: 从 '@angular/c... 导入 { Component }

回答 2 投票 0

Angular/Ionic 构建无法正确显示且没有错误

我开发了一个 Angular/Ionic 项目。但现在在构建(npm run 或 npm run --prod)时,构建实际上不起作用。浏览器中只显示一半页面,c 中没有提供任何错误...

回答 1 投票 0

使用blob,如何通过从下面的代码获取respData来将文件保存到android本地目录

var blob = new Blob([resp.data],{type: resp.headers('Content-Type')}); 我尝试使用下面的代码但无法下载到本地目录 $cordovaFile.writeFile(路径文件, 文件名,

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.