如何在 useEffect 中调用 useNavigate?
我是新手反应.我正在使用ANTD-MOBILE制作应用程序.对于底部导航,我正在使用const [navLink, setNavLink] = React.useState("/"); const navigate = useNavigate(); const redirect = useCallback(() => navigate(navLink, {replace: true}), [navigate]); 我想重定向到单击哪个选项卡,因为我使用了状态,塔巴尔的on Change首先更改状态并调用重定向.但是由于某种原因,先前的状态已加载.如果我处于状态1并单击2,则在1上保持在1,当我单击4时,它将转到2,依此类推.因此,重定向可能是在状态变化之前加载的. - {setNavLink(key); redirect();}}> {tabs.map(item => (
6 2024-02-27
编程技术问答社区
用于非原生移动Web开发的Ant Design antd vs antd-mobile
阅读有关蚂蚁设计的信息,我对用于移动Web开发的哪个库感到困惑.有两个库,antd和antd-mobile.虽然很明显,Antd-Mobile支持对iOS和Android的反应,但尚不清楚哪个最适合普通移动(非本地/SPA)Web开发. 阅读ANTD简介您会看到诸如"专门为内部桌面应用程序创建的Ant Design,..."之类的陈述,同时阅读ANTD-MOBILE简介,您将看到"支持Web/ios/android平台(基于React本机)" 由此我认为蚂蚁以某种方式不适合Web开发,而不是基于Web的桌面(即Elektron)应用程序. 但是试图用蚂蚁摩托车构建普通的Web应用程序,我无法使其工作.例如,该按钮正在显示,但datepicker却没有.切换到蚂蚁似乎一切正常. 我是否可以假设,对于任何非本地移动开发,您都需要使用蚂蚁而不是蚂蚁摩托车? 如果是这样,Antd-Mobile提到的这个支持的" Web"平台是什么? 解决方案 根据我的经验:
10 2024-02-27
编程技术问答社区
antd-mobile Grid的相关疑问
问 题 本地环境 antd-mobile 版本:最新 浏览器 (或标明是 react-native) 及其版本:google chrome 运行环境及其版本:最新 引用Grid 当前设置为跑马灯, 但是默认行数为2行, 但是我只想要单行显示, 请问有什么好的建议吗~ 解决方案 设置 carouselMaxRow 请仔细看文档 https://mobile.ant.design/com...
600 2022-07-19
编程技术问答社区
react.js - antd 在create-react-app中用antd搭建PC端SPA,路由切换后,浏览器前进后退后菜单激活状态如何改变
我用create-react-app搭建项目,UI库用antd,react-router4.1.1做路由,做了一个侧边导航做路由切换,已经实现,但是当我点击浏览器的前进和后退按钮时候如何让导航菜单的按钮状态随着路由一起变化?现在是点击前进后退之后路由依然切换,但是menu按钮的状态不动。现在就是差一个事件,判断是否点击了前进或后退,然后设置isSelect的值 react state代码: state = { isSelect:'/index' }; antd代码:
440 2022-07-19
编程技术问答社区
antd-mobile 高清方案疑问
问 题 本地环境 antd-mobile 版本:最新 浏览器 (或标明是 react-native) 及其版本:google chrome 运行环境及其版本:最新 你做了什么? 配置高清方案 你期待的结果是: 能够根据手机屏幕缩放显示内容 实际上的结果: 未能根据手机屏幕缩放显示内容 关键代码: index.html Test
450 2022-07-19
编程技术问答社区
antd-mobile Tabs 标签页疑问
问 题 browser / google chrome / antd-mobile: 1.0.1 引用Tabs组件 code: import { Tabs, WhiteSpace } from 'antd-mobile'; const TabPane = Tabs.TabPane; function callback(key) { console.log(key); } const TabExample = () => (
360 2022-07-19
编程技术问答社区
antd-mobile 关于SVG图片不显示的问题
问 题 引用下拉刷新组件, 下拉时看不见Loading 图标, 然而在GitHub Issues 的发觉已经提出过了~ 因为使用的是 roadhog的关系, 文章中并未有说明配置的方式( https://mobile.ant.design/com... roadhog官网: 支持通过 webpack.config.js 以编码的方式进行配置,但不推荐,因为 roadhog 本身的 major 或 minor 升级可能会引起兼容问题。使用时会给予警告,详见 #36 。(webpack.config.js 本身的编写支持 ES6,会通过 babal-register 做一层转换。) 尝试创建 webpack.config.js, 引用给出的代码, 还是无法解决问题 ! 解决方案 svg icon 的文档已更新,添加了 roadhog 的支持 https://mobile.ant.design/com...
908 2022-07-19
编程技术问答社区
javascript - ant-design里为了清空Modal中的值每次点击显示为它设置key,可是却报错
这是官网的解释: 组件有标准的 React 生命周期,关闭后状态不会自动清空。 如果希望每次打开都是新内容,需要自行手动清空旧的状态。或者打开时给 Modal 设置一个全新的 key, React 会渲染出一个全新的对话框。 但是我用的时候就报错,还是说key相同。我一共三个model。一个父级内嵌套着两个子级。有时候点击这三个Modal的控制显示按钮会报错,有时候不会,报错信息: 我的代码: state = { loading: false, mainModal: false, inputItemModal:false, selectItemModel:false, inputModalKey:0, selectModalKey:0, mainModalKey:0,
3506 2022-07-17
编程技术问答社区
react.js - React+Redux+antd-mobile 应用中 全局Loading 组件的使用问题?
问 题 我的使用场景:是在进入页面时 React 的 componentWillMount 方法中 去服务器请求用户信息 通过redux dispatch 一个异步的 方法发起ajax请求,同时显示一个Toast.loading('正在加载') 请求执行完成后通过reducer 更新用户的信息,在页面中通过props判断用户是否加载成功。 如果成功会使用Toast.hide()关闭刚才的loading。 这些都是没问题的。 但是我第二次使用Toast.loading 显示其他信息的时候。弹不出loading框,发现在上面的 render方法中先判断了用户是否加载成功,然后给我直接hide掉了。 请问大家在使用全局Loading 的时候是怎么处理的。 class XXX extends React.Component{ componentWillMount(){ //获取用户名 const {
3224 2022-07-17
编程技术问答社区