根据location.hash传递的数据重新呈现ReactJS嵌套的子组件

Re-render ReactJS nested child components based on data passed by location.hash

本文关键字：新呈现 ReactJS 嵌套 组件 数据 location hash 根据      更新时间：2023-12-24

这是基于location.hash重新发送嵌套组件的好方法吗？我想知道重新渲染整个主组件只是为了更新一个嵌套的子组件是否是一个好方法。

http://jsfiddle.net/fL99kh4x/1/

var router = (function () {
    ...
}());

var Hello = React.createClass({
    render: function () {
        return <a href = "#d/test" > Hello {
            this.props.name
        } < /a>;
    }
});
var Main = React.createClass({
    render: function() {
        return <Hello name={this.props.name} / > ;
    }
});
router.addRoute('', function () {
    React.render( < Main name = "World" / > , document.body);
});
router.addRoute('d/:id', function (id) {
    React.render( < Main name = "Earth" / > , document.body);
});
router.start();

我不想只处理点击事件，这样即使直接调用页面，视图也是正确的。

是；事实上，许多（大多数？）React特定的路由器都是这样工作的。记住，React中的"重新渲染"并不意味着销毁整个DOM，它只是意味着计算一个新的虚拟DOM，并决定在真实DOM中更改什么。

相关文章：