问题标签 [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.
ionic-framework - 带有 Ionic v5 (react) 的 React-testing-library 和 react-hook-form-change 事件不会触发
我正在尝试测试使用Controller
from react-hook-form
with渲染的组件react-testing-library
当我使用一些模拟数据渲染组件时,默认值与预期一致。但是,当我开始更改值时,事件似乎没有触发。从这篇博文看来,ionic 导出了一组测试工具来处理 ionic 的自定义事件。在我的设置之后,setupTests.ts
我尝试同时使用 RTU 的 ionFireEvent 和 fireEvent ,当我使用debug()
. 我已经设置好了,所以我可以同时使用fireEvent
和ionFireEvent
测试:
我也尝试将 data-testid 属性移动到控制器而不是这里IonInput
建议的,结果是一样的:没有事件被触发。
以下是我正在使用的版本:
这是我为演示而创建的一个仓库。
任何帮助将非常感激!
reactjs - 如何在 Ionic React 中动态更改图像?
我对 React 和 TypeScript 很陌生,我遇到了这个问题:
在我的 UI 中,我使用了几个装饰图形,如下所示:
现在,我有一个暗模式切换。当它触发时,我想用适当的暗模式版本替换所有图像。我在想这样的事情:
现在,在 React 中我有两个问题: .src-attribute 是未知的,因为element
它不一定是图像,第二个问题是:我没有将 URI 分配为 src,而是从导入中分配变量。所以实际上没有我可以更改的字符串......如果我被正确告知,React 使用 Base64 来处理以这种方式指定的图像。
我怎样才能在 React 中实现我的目标?
编辑:App.tsx
javascript - 类型参数不可分配给 partial<> 类型的参数
我正在尝试验证我的 Ionic 反应表单,但是在useForm
方法中调用 validationSchema 时出现以下错误。我在尝试调用 validationSchema 时遇到的错误useForm
是Argument of type '{ validationSchema: ...... is not assignable to parameter of type 'Partial<{ mode: "onBlur"......
下面是我的主登录表单代码:
我主要关注中间件(API 开发)和后端。前端方面不多。如果我的问题没有正确表达,我深表歉意。
此外,如果我将状态设置为''
请参阅以 (1) 开头的注释,我无法在输入字段中输入任何内容。
我用来设置 loginProps(loginInput.ts 文件)的界面是:
javascript - IFormContext 只引用了一个类型,但在这里用作值
我正在尝试为离子反应形式建立验证。在我这样做之前,我需要获取输入的状态值。我有一个字段组件,它描述了字段、一个表单结构组件和需要上述两个组件的表单页面。以下是我的表单字段代码:
下面是表单结构的代码:
以下是我的 resetForm 页面代码:
在表单结构代码中,我收到错误消息'IFormContext' only refers to a type, but is used as a value here
。我不明白这里的问题。我明白了,因为 IFormContext 是一个接口,所以它在这里是一种类型。如果是一堂课,我不会有问题。但这里需要是一个接口。
reactjs - 无效的钩子调用。Hooks 只能在函数组件的主体内部调用
请查看elfe-if
以下代码中条件内的验证方法。我无法useLocation
调用react-router-dom
. 我在网上看到过问题,其中一个类似这样: Invalid hook call。但解决方案建议从类更改为函数。它可能不是我的解决方案,因为我在表单验证期间使用我的类的实例来查找值。
javascript - 如何在使用此关键字的方法中设置类变量的状态
我正在尝试在我的 Ionic react 应用程序中显示重置服务的结果。我无法使用,this.setState({resetSuccess})
因为我试图在一个方法中这样做,并且this
会引用该方法的范围。(我也在评论中提到了这个问题)
请参考以下代码:
这是我的渲染功能:
android - 如何在离子+反应+电容器项目中设置最低android版本支持?
我不知道如何设置要支持的最低 android 版本,创建的 apk 仅适用于新版本的 android,不适用于旧版本,我是一名网络开发人员,以前从未开发过任何与 android 相关的东西,应该我在 android studio 上安装了与该版本相关的 sdk 平台,或者我的开发文件中有某些配置要更改???
javascript - Ionic React Promise 在按钮单击设置状态后不等待
好的,我有以下问题:
单击按钮时,我想做一个 GET 请求来检索地址的纬度/经度数据,更新组件的状态,然后以更新的状态作为传递的数据进入下一页。
我的代码如下所示:
控制台记录了我这个:
老实说,我希望 history.push() 等到 await geocode(address) 解决以继续执行方法。
有人能告诉我我错过了什么吗?
android - “未找到 ID 为 'io.fabric' 的插件”错误。从 build.gradle 中删除织物后
在我使用电容器构建的 ionic react 项目 android 版本中,我遵循了移除所有织物并用 crashlytics 替换它们的步骤
参考:https ://firebase.google.com/docs/crashlytics/upgrade-sdk?platform=android
构建命令:
现在我只是在构建时遇到错误:
这是我的项目 build.gradle:
这是我的应用程序 build.gradle:
版本参考:
reactjs - 如何在 Ionic React 中添加全局组件(导航)
我正在尝试在我的 Ionic React 项目中添加一个全局导航/菜单栏组件,就像您在任何网站上所做的那样。
所以我创建了一个标准<Nav/>
组件 i React,但似乎我只能将它添加到我的 Ionic 应用程序的特定页面中,而不是在我App.tsx
设置路由器的文件中。
我的App.tsx
组件如下所示:
我想像我通常在标准的 create-react-app 项目中所做的那样将我的添加<Nav/>
到下面的第 4 行。<IonReactRouter>
但是,如果我这样做,<Nav/>
则不会渲染,也不会出现错误。
那不可能吗?我需要添加<Nav/>
到项目中的每个页面吗?