Reactjs链接不上的IE11工作,但确实在边缘和其他浏览器

问题描述 投票:1回答:1

我有以下代码:

import { Link } from 'react-router-dom';

import DetailsOneIcon from '@material-ui/icons/ListAlt';
import DetailsTwoIcon from '@material-ui/icons/PlaylistAddCheck';

const OrderItemActions = ({ order, classes }) => {
    return (
        <div>
            <Tooltip title="Details 1 page">
                <IconButton aria-label="My details">
                    <Link to={`/orders/${order.orderReference}/details1`}>
                        <DetailsOneIcon />
                    </Link>
                </IconButton>
            </Tooltip>
            <Tooltip title="Details 2 page">
                <IconButton aria-label="My details 2">
                    <Link to={`/orders/${order.orderReference}/detail2`}>
                        <DetailsTwoIcon />
                    </Link>
                </IconButton>
            </Tooltip>
        </div>
    );
}

const mapStateToProps = (state) => {
    const getWarehouseOrder = warehouseOrder();

    return (state, { order }) => getWarehouseOrder(state, order.orderReference);
}

export default connect(mapStateToProps)(withStyles(styles)(OrderItemActions));

而且我对这些版本:

"react": "^16.6.3",
"react-dom": "^16.6.3",
"react-redux": "^5.1.1",
"react-router-dom": "^4.3.1",
"react-router-redux": "^4.0.8",

作为主题说,这不会对IE11的工作,但它的边缘,Chrome和Firefox浏览器。

如果我检查F12控制台上的网络电话,我看不出有什么动静都没有。因此,底层的URL呼叫没有尝试在IE11。

IE浏览器的使用正在消亡,但此时我仍然有一个官方的要求,支持IE和边缘。所以,我需要解决这个问题。

任何指针?

UPDATE

这是造成这种情况的IconButton,如果我删除此:

<IconButton aria-label="My details">

点击按钮正常工作。

PS:这是一个跟进我刚才的问题:

What's the proper way to link to a route with parameters?

javascript reactjs internet-explorer ecmascript-6 routing
1个回答
2
投票

React.js它只是现代的JavaScript代码,你可以解决你的问题,如果正确的配置你的巴贝尔尝试改变.babelrc为即11

{
  "presets" : [
    ["env", {
      "targets": {
        "browsers": ["last 2 versions", "ie >= 11"]
      }
    }],
    "react",
  ]
}
© www.soinside.com 2019 - 2024. All rights reserved.