标签: ionic5

我无法让标签导航正常工作。

到目前为止，这是我的代码：

应用程序.tsx：

const App: React.FC = () =>
  <IonApp>
      <IonReactRouter>
          <IonRouterOutlet id="main">
              <Route exact path="/" render={() => <Redirect to="/home"/>}/>
              <Route path="/home" render={(props) => <Home {...props}/>} exact={true}/>
          </IonRouterOutlet>
      </IonReactRouter>
  </IonApp>
)

主页.tsx：

const Home: React.FC<RouteComponentProps> = (props: RouteComponentProps) => (
    <IonPage>
        <IonTabs>
            <IonRouterOutlet id='tabs'>
                <Route path='/:tab(myDecks)' render={(props) => <MyDecks {...props} />} exact/>
                <Route path='/:tab(explore)' render={(props) => <Explore {...props} />} exact/>
                <Redirect from='/home' to='/myDecks'/>
            </IonRouterOutlet>
            <IonTabBar slot='bottom'>
                <IonTabButton tab='myDecks' href='/myDecks'>
                    <IonLabel>My Decks</IonLabel>
                </IonTabButton>
                <IonTabButton tab='explore' href='/explore'>
                    <IonLabel>Explore</IonLabel>
                </IonTabButton>
            </IonTabBar>
        </IonTabs>
    </IonPage> …

我\xe2\x80\x99m 试图找到一种方法来使用电容器打开设置/首选项应用程序，但我\xe2\x80\x99m 不成功。

App.canOpenUrl({ url: \'com.apple.Preferences\' })失败并显示错误消息-canOpenURL: failed for URL: "com.apple.Preferences" - error: "Invalid input URL"

我\xe2\x80\x99m 不确定我\xe2\x80\x99m 是否做错了，或者\xe2\x80\x99s 是否甚至可以使用电容器打开本机应用程序\xe2\x80\xa6？

本文展示了如何打开 facebook 应用程序，但没有介绍本机应用程序

我在尝试添加ngx-datatable到我的ionic + angular项目时遇到错误。我收到了成百上千的错误行，它似乎没有添加ngx-database到我的项目中。我正在关注Add ngx-datatable with ionic 5以添加ngx-datatable到我的项目中。

包.json

"@angular/common": "~8.2.14",
"@angular/core": "~8.2.14",
"@angular/forms": "~8.2.14",
"@angular/platform-browser": "~8.2.14",
"@angular/platform-browser-dynamic": "~8.2.14",
"@angular/router": "~8.2.14",
"@ionic-native/core": "^5.0.7",
"@ionic-native/splash-screen": "^5.0.0",
"@ionic-native/status-bar": "^5.0.0",
"@ionic/angular": "^5.0.0",
"@swimlane/ngx-datatable": "^17.0.0",
"core-js": "^2.5.4",
"rxjs": "~6.5.1",
"tslib": "^1.9.0",
"zone.js": "~0.9.1"

在 app/home.module.ts

import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { CommonModule } from '@angular/common';
import { IonicModule } from '@ionic/angular';
import { FormsModule } from '@angular/forms';
import { HomePage } from …

直接的图像元素似乎在 Ionic React 中不起作用。

我在 asset/images 文件夹中添加了一个图像，并给出了图像元素的相对路径src。

<img src="../../assets/images/image-1.jpeg" alt=""/>

我使用CodeSandbox创建了一个工作示例。如果我在这里做错了什么，有人可以帮助我吗？

我正在使用 ionic v5 工作。我想在寻呼机点单击上滑动图像，但现在不起作用。

我的代码是：

 <ion-slides pager="true">
   <ion-slide>
     <p>Page1</p>
   </ion-slide>
   <ion-slide>
     <p>Page2</p>
   </ion-slide>
   <ion-slide>
     <p>Page3</p>
   </ion-slide>
 </ion-slides>
</ion-content>

我正在 ionic 5 应用程序中测试 fullcalendar/angular 5，视图的标题工具栏显示为两个按钮：

这是我的日历选项：

  calendarOptions: CalendarOptions = {\n    contentHeight: "auto",\n    headerToolbar: {\n      left: \'title\',\n      center: \'timeGridMes, timeGridDia\',\n      right: \'prev,next today\'\n    },\n    initialView: \'timeGridDia\',\n    weekends: true,\n    editable: false,\n    selectable: true,\n    selectMirror: true,\n    dayMaxEvents: true,\n    allDaySlot:false,      \n    initialDate: new Date(),\n    firstDay: 1,\n    fixedWeekCount: false,\n    locale: \'es\',\n    slotMinTime : "08:00:00",\n    slotMaxTime : "23:00:00",\n    navLinks: true,\n    nowIndicator: true,\n    slotDuration: "00:15:00",\n    slotLabelInterval: "00:15:00",\n    eventTimeFormat: { hour12: false, hour: \'2-digit\', minute: \'2-digit\' },\n    showNonCurrentDates: true,\n    timeZone: \'local\',\n    weekNumbers: true,\n    weekText: …

我想在 ionic 版本 5 的页面之间传递一些数据。有什么可能的方法可以做到这一点吗？我正在使用离子版本“5.4.16”和角度版本“10.0.8”。

我在 Ionic 5 中有一个 React 应用程序，我想向其中添加一些自定义 SVG。

这个问题是关于 Angular 的，但我的问题是关于 React 的。

我的应用程序文件夹结构如下所示：

• 源代码
  • 资产
    • 听.svg
    • SvgListen.tsx

这是SvgListen.tsx：

import React from 'react';
import { ReactComponent as ListenSvg } from './listen.svg';
import { IonIcon } from '@ionic/react';

const SvgListen = () => (
  <>
    <ListenSvg />
    <IonIcon src="./listen.svg" font-size="48px" />

  </>
);

export default SvgListen;

在 Chrome 中测试应用程序时，我得到以下 HTML：

<ion-icon src="./listen.svg" font-size="48px" role="img" class="ios hydrated"></ion-icon>

我<ListenSvg />导入的显示正确；但是，不显示离子图标。也没有错误消息。

我查看了这篇博文，但那里概述的方法也没有成功。

如何<IonIcon>在 Ionic 5 中显示自定义 …

我无法在不出现此错误的情况下导入 GooglePlus。

控制台错误

\n

错误错误：未捕获（承诺）：错误：类型 GooglePlus 不\n具有“\xc9\xb5mod”属性。\ngetNgModuleDef@http://localhost:8100/vendor.js:57098:15\nrecurse@http://本地主机：8100/vendor.js:81227:35\nrecurse@http://localhost:8100/vendor.js:81238:24

\n

tab1/tab1.module.ts

...\nimport { Tab1PageRoutingModule } from './tab1-routing.module';\nimport { GoogleSignupComponent } from './google-signup/google-signup.component';\nimport { GooglePlus } from '@ionic-native/google-plus/ngx';\n\n@NgModule({\n  imports: [\n    ...\n    Tab1PageRoutingModule,\n    GooglePlus\n  ],\n  declarations: [Tab1Page, GoogleSignupComponent],\n})\nexport class Tab1PageModule { }\n

tab1/google-signup/google-signup.component.ts

...\nimport { GooglePlus } from '@ionic-native/google-plus/ngx';\n@Component({\n  selector: 'app-google-signup',\n  templateUrl: './google-signup.component.html',\n  styleUrls: ['./google-signup.component.scss'],\n})\nexport class GoogleSignupComponent implements OnInit {\n\n  constructor(private googlePlus: GooglePlus) { }\n\n  ngOnInit() { }\n\n  public google() {\n    console.log('google signup');\n    this.googlePlus.login({})\n      .then(res => console.log(res))\n      .catch(err …

我在手机和 android studio 上测试我的离子应用程序时遇到问题，当我按下硬件后退按钮时，应用程序立即退出，我尝试了很多解决方案，但它根本不起作用，也不会听我的任何代码进去。

这是我的尝试

import { Component, Renderer2, ViewChild } from '@angular/core';

import { IonRouterOutlet, Platform } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';
import { TranslateService } from '@ngx-translate/core';
import { Location } from '@angular/common';

@Component({
  selector: 'app-root',
  templateUrl: 'app.component.html',
  styleUrls: ['app.component.scss']
})
export class AppComponent {

  @ViewChild(IonRouterOutlet, {static: true}) routerOutlet: IonRouterOutlet
  constructor(
    private platform: Platform,
    private splashScreen: SplashScreen,
    private statusBar: StatusBar,
    private renderer: Renderer2,
    private translate: TranslateService,
    private location: Location …