问题标签 [ionic-react]

我正在使用 Ionic React 的侧边菜单模板，所以我的大部分逻辑都在 ExploreContainer.tsx 中。

现在，由于我正在为移动设备构建它，因此我正在使用电容器。这使我能够监听硬件后退按钮事件。当用户按下他们的后退按钮时，我希望他们在这个例子中回到“主页”。我发现的所有答案总是指导航按钮，可以在其中声明自定义状态并可能使用<Redirect />组件。

现在，为了扩展前一个示例，假设我想要这样的东西：

可悲的是，这不起作用。以前我尝试过以下方法：

然而，这会导致一些非常丑陋的行为。应用程序完全重新加载，所有变量都被重置，等等。

如果我理解正确， 的name属性ExploreContainer是当用户从菜单中选择一个项目时改变的状态，所以通常应用程序不需要重新加载。

我该怎么办？

我想显示一个 .svg 图像，它位于我src目录的 assets 目录中。

这是文件夹结构的一瞥 -

我想balloons.svg从Register.tsx. 我正在使用该IonImg元素并尝试过像../assets/balloons.svg源这样的目录，但它们似乎不起作用。

注意：如果我使用图像 URL 作为源，图像会正确显示。

问题：react-app-rewired start适用于 App.jsx（也适用于 .js）但不适用于 App.tsx（也适用于 .ts）

脚步

1. 我创建了一个样板应用程序ionic start my-app blank --type=react --capacitor
2. 在 package.json 上，我相应地替换并重新安装（删除 package.lock.json，npm i）

3. config-overrides.js在项目的根文件夹中添加文件

4. 将 App.tsx 替换为

5. 现场tsconfig.json_"strict": false
6. npm start（或react-app-rewired start）在项目根文件夹中

终端上没有错误（'编译成功！'），chrome 屏幕是空白的，在 chrome 控制台上：

奇怪的是，如果我用 .jsx 或 .js 而不是 .tsx 或 .ts 更改应用程序扩展名，该应用程序可以正常工作

设置 CRA 打字稿应用程序而不是ionic start --type=react --capacitor应用程序时，哈巴狗设置也适用

编辑：这是工作/不工作回购的 github https://github.com/calvindio/template-ionic-react-ts-pug

我正在建立一个网站来展示带有 React 和 Ionic 的房地产。

我的App.tsx中有这个路由

我链接到"/property/:id"我网站中的单个页面，如下所示：

现在在我的"/property/:id"页面上，我可以像这样从 URL 访问 id：

问题是，当我点击返回说主屏幕，然后访问我的另一个"/property/:id"页面时，它props.match.params.id保持不变。它不更新。

可以做些什么来修复它？

项目要求根据输入值的变化来满足输入值；例如：cash 和 pos 是两个字段，有一个全局价格，价格为 70，如果用户输入现金 50，则 pos 必须履行为 20，而如果用户输入 30 为 pos，则必须兑现现金40.

我们将Ionic React输入用于表单，使用React Hook Form进行验证，并使用以下代码：

虽然它正在工作，但有一个问题：倾斜。

onChanging输入不能像那样倾斜，它必须继续编辑而不是将其替换为一个值，因为它可以正常工作，但我不知道如何做到这一点。

有什么办法吗？

谢谢你。

我们如何使用 react-hook-form 和 ionic 在表单之外触发表单提交。我相信我们可以使用按钮上的表单属性来做到这一点，但离子按钮不允许 IonButton 上的表单属性

下面的代码最初在 chrome 中工作，突然停止工作，而且这段代码在 safari 浏览器上也不起作用。看起来 Ionic 会释放按钮上的 form 属性，但是直到我们在 Ionic 按钮上得到解决的 form 属性，我正在尝试找到一种适用于所有浏览器的解决方法

我将 Ionic 与 React 一起使用。

在我的应用程序中，我同时拥有侧边菜单和选项卡。

在选项卡中，只有默认选项卡正常工作，其他选项卡显示空白屏幕。

我的代码如下：

1. App.tsx 如下所示

在此，下面的路线打开一个标签页

2. Tabs.tsx 看起来如下

3. Tab1.tsx 长这样

其他选项卡 Tab2.tsx 和 Tab3.tsx 看起来完全一样。

如何使用 IonCard 在 IonGrid 上启用水平滚动。下面是我试图启用水平滚动的代码，以便所有字段都将显示在任何设备或浏览器的同一行中

我只是尝试在我的ionic react项目中使用react-native-svg ，并且能够使用 react-native-web 使其成功。但是，如果我确实像这样导入

它说

找不到模块 react-native。

我该如何解决这个问题？

在 Ionic-React 中如何使用离子幻灯片创建轮播并希望在 IonList 中使用它，因此图像可以是缩略图或头像。我尝试更改 CSS 但没有运气，而且自动播放也不起作用。

想要纯粹在 ionic 中使用它，以便也可以在移动设备上访问它。