React Redux在组件的多个级别上传递多个参数

我曾问过这个问题question，它提出了更多关于组件间参数传递方式的问题。React Redux在组件的多个级别上传递多个参数

假设你有三个组件是儿童的底部或孩子。中间或孩子。和顶部 - 在我的情况下，容器。

我目前在底部组件：

const GlyphiconDirectionChange = (props) => { 
const { onSortDirectionChange } = props 
return (
    <span onClick={() => onSortDirectionChange('Ascending')} className='glyphicon glyphicon-sort-by-attributes'></span> 
)

注单变量“升序”的设置。

的中等或者子组件有：

export const TableHeaders = (props) => { 
    const { onSortDirectionChange } = props; 
    return (
    <GlyphiconDirectionChange onSortDirectionChange={onSortDirectionChange} /> 
)

顶部或容器组件有：

class ClientsContainer extends Component { 

    handleSortDirection = (values = {}) => { 
    const { sortDirection, query, sortBy } = this.props 
    const direction = values 
    const searchParams = { 
     query, 
     sortBy, 
     direction, 
     ...values, 
     currentPage: 1, 
    } 
    console.log('changeSortDirection()!', searchParams) 
    this.fetchClients(searchParams) 
    } 

    return (
    <div className="row"> 

     <TableHeaders onSortByChange={this.handleSortBy} 
     onSortDirectionChange={this.handleSortDirection} 
     query={query} 
     currentPage={currentPage} 
     /> 

    </div> 
) 
}

我的问题是，不用担心在这种情况下有关上下文如你为什么会需要两个或多个变量来管理排序方向..你将如何从底部组件传递多个参数，并确保它被应用到“HandleSortDirection”中的正确变量......如何设置第二个和/或第三个参数在“GlyphiconDirectionChange”中设置，然后如何在“HandleSortDirection”中检索它（最新的正确语法）？

来源

2017-04-22 si2030

你能传递一个JavaScript对象作为参数之一吗？例如，'onSortDirectionChange（{'direction'：'Ascending'，'someOtherArgument'：'someOtherValue'}）'。我不明白你为什么不能为你的函数提供两个参数。 – user2027202827

尝试将对象作为第一个参数传递给“底部组件”。

const GlyphiconDirectionChange = (props) => { 
    const { onSortDirectionChange } = props 
    let options = { 
    order: 'Ascending', 
    // ... and other props you want 
    offset: 10 
    } 
    return (
    <span 
     onClick={() => onSortDirectionChange(options)} 
     className='glyphicon glyphicon-sort-by-attributes' /> 
) 
}

所以在“顶部组件”，你会得到

handleSortDirection = (options = {}) => { 
    const { sortDirection, query, sortBy } = this.props 
    let { order, offset } = options 
    ... 
}

来源

2017-04-22 04:26:25

React Redux在组件的多个级别上传递多个参数

回答

相关问题