3

我想知道处理我的情况的最佳方法是什么。我有两个Link组件，每个组件都将状态中的不同变量传递给下一个组件。根据传递的状态，组件有条件地呈现页面上的某些元素。

获取位置的状态并将我的组件的状态设置为保存该变量是最佳做法吗？或者不将其保存在组件的状态中并根据位置的状态有条件地渲染是否可以？

无论哪种方式我都可以，但我想知道你的想法。

链接示例：

<NavLink
    key='individual'
    to={{
        pathname: '/',
        state: 'individual',
    }}>
    {name}
</NavLink>
<NavLink
    key='business'
    to={{
        pathname: '/',
        state: 'business',
    }}>
    {name}
</NavLink>

组件示例保存到状态：

export default ({
    location,
    customer
}) => {
    if (customer !== location.state.type) updateCustomerType(location.state.type)

    return (
        {customer === 'individual' 
            ? ( <div> Hello! </div> ) 
            : ( <div> World! </div> )
        }
    )
}

组件示例未保存到状态：

export default ({
    location
}) => {
    const customer = location.state.type

    return (
        {customer === 'individual' 
            ? ( <div> Hello! </div> ) 
            : ( <div> World! </div> )
        }
    )
}

使用 React Router 4 和重构

4

0 回答 0