javascript - RectRouter 中点击链接的时候,component 会被渲染两次?
PHP中文网
PHP中文网 2017-04-11 11:43:35
[JavaScript讨论组]

Router 代码:

import React from 'react';
import { Router, Route, hashHistory , IndexRoute} from 'react-router';
import Layout from '../components/layout/layout.jsx';
import Index from '../components/index.jsx';


export default class extends React.Component {
    render(){
        return (
              
                
                    
                
              
            );
    }
};

Layout代码:

import React from 'react';
import {Layout,Affix,BackTop,Icon} from 'antd';
const {Header,Content,Footer}  = Layout;
import LayoutFooter from './footer.jsx';
import LayoutHeader from './header.jsx';


require("./style/layout.less");

export default class CnodeLayout extends React.Component {
    static visibilityHeight = window.innerHeight + 100;
    render(){
        console.log('Layout render called');
        return (
            
                
                    
                
                

{this.props.children}

); } }

链接的代码:

class NavTag extends React.Component {
    render(){
        return (
                

全部 精华 分享 问答 招聘

); } }

查看了一下渲染出来的dom,也是正确的:

这是我的打印信息,object 答应的是react-router 的location

但是我在Layout和Index中打印输出发现render 会被调用两次。。。请问是为什么?

PHP中文网
PHP中文网

认证高级PHP讲师

全部回复(1)
怪我咯

是这样的,点击react-router的链接就已经触发了你的“Router 代码”的re-render, 更何况其子组件。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号