问题标签 [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.
reactjs - 使用 ExploreContainer 模板在 Ionic React 中进行编程导航
我正在使用 Ionic React 的侧边菜单模板,所以我的大部分逻辑都在 ExploreContainer.tsx 中。
现在,由于我正在为移动设备构建它,因此我正在使用电容器。这使我能够监听硬件后退按钮事件。当用户按下他们的后退按钮时,我希望他们在这个例子中回到“主页”。我发现的所有答案总是指导航按钮,可以在其中声明自定义状态并可能使用<Redirect />
组件。
现在,为了扩展前一个示例,假设我想要这样的东西:
可悲的是,这不起作用。以前我尝试过以下方法:
然而,这会导致一些非常丑陋的行为。应用程序完全重新加载,所有变量都被重置,等等。
如果我理解正确, 的name
属性ExploreContainer
是当用户从菜单中选择一个项目时改变的状态,所以通常应用程序不需要重新加载。
我该怎么办?
reactjs - 带有 pug.js 的 Ionic React Typescript,使用 tsx 但不使用 jsx 时出现“未捕获的 ReferenceError:React 未定义”
问题:react-app-rewired start
适用于 App.jsx(也适用于 .js)但不适用于 App.tsx(也适用于 .ts)
脚步
- 我创建了一个样板应用程序
ionic start my-app blank --type=react --capacitor
- 在 package.json 上,我相应地替换并重新安装(删除 package.lock.json,
npm i
)
config-overrides.js
在项目的根文件夹中添加文件
- 将 App.tsx 替换为
- 现场
tsconfig.json
_"strict": false
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
reactjs - Ionic React props.match.params 不更新
我正在建立一个网站来展示带有 React 和 Ionic 的房地产。
我的App.tsx中有这个路由
我链接到"/property/:id"
我网站中的单个页面,如下所示:
现在在我的"/property/:id"
页面上,我可以像这样从 URL 访问 id:
问题是,当我点击返回说主屏幕,然后访问我的另一个"/property/:id"
页面时,它props.match.params.id
保持不变。它不更新。
可以做些什么来修复它?
ionic-framework - React-Hook-Forms 和 Ionic - 如何使用表单外的按钮提交表单
我们如何使用 react-hook-form 和 ionic 在表单之外触发表单提交。我相信我们可以使用按钮上的表单属性来做到这一点,但离子按钮不允许 IonButton 上的表单属性
下面的代码最初在 chrome 中工作,突然停止工作,而且这段代码在 safari 浏览器上也不起作用。看起来 Ionic 会释放按钮上的 form 属性,但是直到我们在 Ionic 按钮上得到解决的 form 属性,我正在尝试找到一种适用于所有浏览器的解决方法
ionic-framework - 如何使用 Ionic 5-React 在 IonGrid 上启用水平滚动
如何使用 IonCard 在 IonGrid 上启用水平滚动。下面是我试图启用水平滚动的代码,以便所有字段都将显示在任何设备或浏览器的同一行中
reactjs - 在 Ionic-React 项目中导入 react-native 库
我只是尝试在我的ionic react项目中使用react-native-svg ,并且能够使用 react-native-web 使其成功。但是,如果我确实像这样导入
它说
找不到模块 react-native。
我该如何解决这个问题?
ionic-framework - 带离子载玻片的离子反应转盘
在 Ionic-React 中如何使用离子幻灯片创建轮播并希望在 IonList 中使用它,因此图像可以是缩略图或头像。我尝试更改 CSS 但没有运气,而且自动播放也不起作用。
想要纯粹在 ionic 中使用它,以便也可以在移动设备上访问它。