问题标签 [ionic-react]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
170 浏览

reactjs - IonReactRouter 不是 JSX 元素的构造函数

我正在使用与离子反应。我已经安装了@ionic/react@ionic/react-router包,就像我以前开发的其他项目一样。在这个项目中,我尝试使用汇总为其他项目生成可重用组件,但在这种情况下,我会出现错误IonReactRouter,以下是我的代码:

使用此代码,出现以下错误。

这是我的 package.json:

这是我的汇总配置:

我不明白为什么这段代码会发生这种情况,我也不知道如何调试或修复它。

0 投票
2 回答
145 浏览

reactjs - 将承诺的返回值分配给反应中的外部变量

我希望你身体健康。我正在使用离子和反应开发一个简单的移动应用程序。我正在使用 sql 数据库,为此我创建了用于用户注册和登录的 Api。每当用户登录时,应用程序使用本地存储存储用户会话。[保存会话的代码]

没有问题是这样的:[检索存储值的代码]

这里变量 (p3) 包含实际的用户名。但是当我将其值分配给会话变量时。会话变量变得未定义。我不知道如何从这个函数中获取会话值。请帮我解决这个问题。谢谢

0 投票
2 回答
4316 浏览

reactjs - 在 React 中通过 getBoundingClientRect 接收元素的尺寸

我想以可靠的方式找出 DOM 元素的尺寸。

我的考虑是为此使用 getBoundingClientRect 。

这种方法的问题是 useEffect 仅对 elementRef.current 做出反应,而不对 rect 更改做出反应。显然浏览器中组件的绘制还没有完成,因为尺寸总是0。

如果我在 useEffect 之外做所有事情,那么它就可以工作。在控制台中,我看到 0 的 2 倍值,然后是正确的尺寸。

使用 useEffect:

具有 useEffect 的维度

使用效果之外:

尺寸外使用效果

但是,我想将尺寸保存在状态中,为此我需要 useEffect。

如何使用 getBoundingClientRect 实现这一点,或者有其他方法可以做到这一点吗?

解决方案

这不是自我反应的问题。这是离子 V5 反应中的错误。

通常你可以这样做:

https://reactjs.org/docs/hooks-faq.html#how-can-i-measure-a-dom-node

但这里有一个问题:

https://github.com/ionic-team/ionic/issues/19770

我的解决方案是使用:https ://github.com/que-etc/resize-observer-polyfill

0 投票
2 回答
1623 浏览

ionic-framework - 在子页面上隐藏 IonTab - Ionic React 5

我正在构建 Ionic React 应用程序,离子的版本是 5。在我的应用程序中,我有底部导航。我在 App.tsx 中提到过底部导航的逻辑。

我在仪表板页面上有一个添加按钮,单击该按钮我希望打开一个不包含底部导航的页面。我在互联网上得到了很多针对 Ionic-Angular 的答案。我正在专门寻找 Ionic-React 的答案。

0 投票
1 回答
534 浏览

reactjs - 离子反应如何制作动画在组件上重新渲染?

我正在使用下面的代码为我的滑块菜单设置动画,因为没有合适的离子菜单控制器示例进行反应。

问题是,它第一次运行良好。但在那之后它甚至在我的组件重新渲染之后也没有。

0 投票
1 回答
358 浏览

reactjs - Ionic React 如何使用 css 属性

我是 IonicReact 的新手,我不知道如何对该组件使用 css 属性。例如我正在使用 IonItem 组件,但它不起作用

它具有默认的填充和高亮效果,所以我想删除它但不知道该怎么做。我尝试使用useStyles()CSSProperties但不起作用。

它具有自定义 css 属性,例如 --highlight-height、--inner-padding-start,但不确定如何将它们与 useStyles 和 CSSProperties 一起使用。

0 投票
0 回答
196 浏览

reactjs - 离子反应推动组件过渡问题

我正在开发一个具有 ionic/react 的应用程序,并且需要推送到新组件,因此通过

它可以完成工作,但是过渡存在问题。似乎正在加载新组件,然后再次加载相同的组件时会发生推送动画。

我可以将 routerLink 与 routerDirection 一起使用,但无法找到使用这种方法传递数据的方法。

0 投票
1 回答
53 浏览

reactjs - IonSearchbar inputmode="search" 在 iPhone 上不起作用

我什至尝试用标签嵌入它,但 iPhone 中的键盘仍然显示返回而不是搜索。另外如何获得键盘搜索点击事件?

0 投票
0 回答
91 浏览

android - 离子反应本机-> js 通信

我是一般的离子电容器和 javascript 的原生 Android/iOS 开发人员。我正在尝试将数据从 Android 的 OnNewIntent 回调发送到我正在处理的 ionic-react 项目。我在扩展 BridgeActivity 的本机 MainActivity.java 中执行此操作:

在我的 App.tsx 文件中,我有这样的内容:

但我一生都无法通过从本机 Activity 到 App.tsx 文件的消息。我尝试在 Activity 恢复后将触发器延迟最多 15 秒,以确保每个人都被实例化,但我仍然没有看到消息已收到的迹象。有没有一种简单的方法可以从本机层通信到我缺少的电容器层?是不是这些早期的 Android 生命周期事件发生在 ionic 侦听器有机会注册之前?只是试图在渲染第一个屏幕之前将只有本机端知道的启动数据发送到离子端。

谢谢!斯科特

0 投票
1 回答
346 浏览

ionic-framework - 使用 React.js 在 Ionic 上初始化 OneSignal SDK

我正在尝试在带有 React 应用程序的 Ionic 上使用 OneSignal SDK 开始,但我找不到任何 React 指南,我发现的只是角度,而且我不习惯打字稿。

我需要在哪里初始化 OneSignal SDK?

我正在尝试在 App.componentDidMount 中执行此操作,例如:

但是IDE继续给我关于this.oneSignalxxx类型不存在的错误。