当我单击链接时,为什么我的react / webpack应用程序会刷新?

詹姆

我有一个内置react应用程序我正在用服务器服务一切当我点击时,我希望将标签添加到我希望这能下载文件而不刷新页面。webpackchunksexpresslinkscriptindex.html

这是我的server.js

app.use(express.static('./dist'));

app.get('/', function (req, res) {
  res.sendFile(__dirname + '/dist/index.html');
});

var server = app.listen(3000, function () {
  console.log("Listening on 3000");
}

这是我的webpack.config

module.exports = {
    entry: {
        app: './App.js',
        vendors: vendors
    },
    output: {
        filename: './bundle.[hash].js',
        chunkFilename: './[id].[hash].js',
        path: __dirname + '/dist'
    },
    module: {
        loaders: [
            {
                test: /\.js?$/,
                exclude: /(node_modules)/,
                loader: 'babel',
                query: {
                    presets: ['react', 'es2015']
                }
            }
        ]
    },
    plugins: [
            new HtmlWebpackPlugin({
                template: 'index.ejs'
            }),

        new CommonsPlugin({
            name: 'vendors',
            filename: 'vendors.js',
            minChunks: Infinity
        })
    ]
};

这是App.js一切开始地方:

const rootRoute = {
    component: 'div',
    childRoutes: [ {
        path: '/',
        component: Main,
        childRoutes: [
            require('./routes/reports')
        ]
    } ]
};

render(
    <Router history={browserHistory} routes={rootRoute} />, document.getElementById('app')
);

最后,在我的Main.js具有链接的组件中:

class Main extends React.Component {
    render() {
        return (
                <div>
                    <Link href="/reports">Reports</Link>
                    <div>
                        {this.props.children || <Home /> }
                    </div>
                </div>
        )
    }
}

export default Main;

该页面有效,但是当我单击中的reports链接时Main,我的页面会刷新,而不仅仅是插入新代码。我究竟做错了什么?

编辑:

这是“路线/报告”

module.exports = {
    path: 'reports',
    getComponents(location, cb) {
        require.ensure([], (require) => {
            cb(null, require('./components/Reports'))
        })
    }
}

Reports组件:

class Reports extends React.Component {
    render() {
        return (
                <div>
                    <h2>Reports</h2>
                </div>
        )
    }
}

module.exports = Reports;
托普曼

代替

<Link href="/reports">Reports</Link>

<Link to="/reports">Reports</Link>

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

当我单击链接时,为什么我的react / webpack应用程序会刷新?

来自分类Dev

当我单击某个按钮时,为什么我的应用程序崩溃?

来自分类Dev

为什么在android中单击我的应用程序的后退按钮后,我以前的活动会自动刷新?

来自分类Dev

当我登录主站点时某个子域认为我已注销时,为什么单击登录链接会立即使我登录?

来自分类Dev

当我单击网站上的链接时,它没有打开?为什么会这样呢?

来自分类Dev

当我在 Flutter 应用程序中刷新标签栏视图时,其他标签栏视图也会刷新

来自分类Dev

为什么当我尝试解开可选项时,我的 Swift 应用程序会抛出致命错误?

来自分类Dev

当我单击按钮时刷新整个用户在WinForms应用程序中输入的数据

来自分类Dev

为什么当我尝试显示我的 ip usig Inet 时我的应用程序崩溃?

来自分类Dev

当我单击链接时,Nextjs导致硬刷新

来自分类Dev

为什么当我将Fragment for Google Maps放到我的应用程序中时

来自分类Dev

当我单击按钮时,应用程序崩溃

来自分类Dev

当我单击按钮时,应用程序停止

来自分类Dev

当我单击外部提供程序按钮时,为什么网站会重定向回“登录”屏幕?

来自分类Dev

当我在项目应用程序中安装并链接 react-native-admob 在加载时崩溃

来自分类Dev

为什么我的应用程序Web链接会捕获域上的任何路径?

来自分类Dev

为什么我的Streamlit应用程序会多次打开?

来自分类Dev

为什么我只能在根目录(/)上打我的react / webpack应用程序?

来自分类Dev

当我在android中按回时为什么不退出该应用程序?

来自分类Dev

当我有应用程序网关时为什么要使用Azure APIM

来自分类Dev

当我在android中按回时为什么不退出该应用程序?

来自分类Dev

当我按下按钮开始 Toast 时,Java 应用程序关闭。但为什么?

来自分类Dev

为什么当我按下按钮在表中插入值时应用程序崩溃?

来自分类Dev

为什么当我点击搜索按钮时应用程序崩溃?

来自分类Dev

当我单击 android studio 应用程序上的任何链接时,应用程序已关闭,我该如何解决?

来自分类Dev

我的应用程序没有刷新

来自分类Dev

为什么按 Escape 关闭 NSPanel 时我的应用程序会崩溃?

来自分类Dev

为什么当我调用shiftHSL时精灵会消失?

来自分类Dev

当我单击或在文本区域中键入内容时,为什么CKEditor会引发JavaScript错误?

Related 相关文章

  1. 1

    当我单击链接时,为什么我的react / webpack应用程序会刷新?

  2. 2

    当我单击某个按钮时,为什么我的应用程序崩溃?

  3. 3

    为什么在android中单击我的应用程序的后退按钮后,我以前的活动会自动刷新?

  4. 4

    当我登录主站点时某个子域认为我已注销时,为什么单击登录链接会立即使我登录?

  5. 5

    当我单击网站上的链接时,它没有打开?为什么会这样呢?

  6. 6

    当我在 Flutter 应用程序中刷新标签栏视图时,其他标签栏视图也会刷新

  7. 7

    为什么当我尝试解开可选项时,我的 Swift 应用程序会抛出致命错误?

  8. 8

    当我单击按钮时刷新整个用户在WinForms应用程序中输入的数据

  9. 9

    为什么当我尝试显示我的 ip usig Inet 时我的应用程序崩溃?

  10. 10

    当我单击链接时,Nextjs导致硬刷新

  11. 11

    为什么当我将Fragment for Google Maps放到我的应用程序中时

  12. 12

    当我单击按钮时,应用程序崩溃

  13. 13

    当我单击按钮时,应用程序停止

  14. 14

    当我单击外部提供程序按钮时,为什么网站会重定向回“登录”屏幕?

  15. 15

    当我在项目应用程序中安装并链接 react-native-admob 在加载时崩溃

  16. 16

    为什么我的应用程序Web链接会捕获域上的任何路径?

  17. 17

    为什么我的Streamlit应用程序会多次打开?

  18. 18

    为什么我只能在根目录(/)上打我的react / webpack应用程序?

  19. 19

    当我在android中按回时为什么不退出该应用程序?

  20. 20

    当我有应用程序网关时为什么要使用Azure APIM

  21. 21

    当我在android中按回时为什么不退出该应用程序?

  22. 22

    当我按下按钮开始 Toast 时,Java 应用程序关闭。但为什么?

  23. 23

    为什么当我按下按钮在表中插入值时应用程序崩溃?

  24. 24

    为什么当我点击搜索按钮时应用程序崩溃?

  25. 25

    当我单击 android studio 应用程序上的任何链接时,应用程序已关闭,我该如何解决?

  26. 26

    我的应用程序没有刷新

  27. 27

    为什么按 Escape 关闭 NSPanel 时我的应用程序会崩溃?

  28. 28

    为什么当我调用shiftHSL时精灵会消失?

  29. 29

    当我单击或在文本区域中键入内容时,为什么CKEditor会引发JavaScript错误?

热门标签

归档