Javascript 选择行时,MaterialTable会将我返回到第一页
我一直在努力使材质表按我希望的方式工作:我需要能够一次选择一行,并使用其状态来操纵其内容。我以示例为基础(更准确地说,是选定的行样式),并设法做到这一点:Javascript 选择行时,MaterialTable会将我返回到第一页,javascript,reactjs,material-ui,material-table,Javascript,Reactjs,Material Ui,Material Table,我一直在努力使材质表按我希望的方式工作:我需要能够一次选择一行,并使用其状态来操纵其内容。我以示例为基础(更准确地说,是选定的行样式),并设法做到这一点: const [rowState, setRowState] = React.useState({ selectedRow: null, }); const [state, setState] = React.useState({ columns: //columns format da
const [rowState, setRowState] = React.useState({
selectedRow: null,
});
const [state, setState] = React.useState({
columns: //columns format
data: //table content
});
<MaterialTable
title="User Management"
columns={state.columns}
data={state.data}
rowsPerPageOptions={[5,6,7]} //this doesn't seem to work at all
onRowClick={((e, selectedRow) => setRowState({ selectedRow }))}
options={{
rowStyle: rowData => ({
backgroundColor: (rowState.selectedRow && rowState.selectedRow.tableData.id === rowData.tableData.id) ? '#DDD' : '#FFF'
})
}}
/>
const[rowState,setRowState]=React.useState({
selectedRow:null,
});
常量[状态,设置状态]=React.useState({
columns://columns格式
数据://表格内容
});
尝试跟踪页面更改并设置表的初始页面,我认为您可以使用onChangePage={(..)=>..}
和options={{{initialPage:..…}}
。这难道不会创建一个在页面更改时触发的函数吗?也许我说的是一种令人困惑的方式,但当我点击任何其他页面的一行时,它会将我发送到第一页,我不希望这种情况发生。不过我会试试这些道具,谢谢!是的,它会在每次页面更改时触发,其想法是存储页码并将组件的initialPage
设置为该存储值,否则,在每次渲染时,组件将返回到第一页(默认initialPage
)。我做了更多的测试,遗憾的是,这似乎不是问题所在。我没有真正使用onChangePage
来更改选项,但我手动更改了,并尝试将initialPage
设置为其他数字。不管怎样,单击第一个页面以外的任何其他页面上的行仍会将我发送到第一个页面。这似乎发生在任何setState
函数中,而像console.log()
或alert()
之类的函数都不会发生。但是仍然不知道为什么会发生这种情况。尝试跟踪页面更改并设置表的初始页面,我认为您可以使用onChangePage={(..)=>…}
和options={{initialPage:…}
。这不会创建一个在页面更改时触发的函数吗?也许我说的是一种令人困惑的方式,但当我点击任何其他页面的一行时,它会将我发送到第一页,我不希望这种情况发生。不过我会试试这些道具,谢谢!是的,它会在每次页面更改时触发,其想法是存储页码并将组件的initialPage
设置为该存储值,否则,在每次渲染时,组件将返回到第一页(默认initialPage
)。我做了更多的测试,遗憾的是,这似乎不是问题所在。我没有真正使用onChangePage
来更改选项,但我手动更改了,并尝试将initialPage
设置为其他数字。不管怎样,单击第一个页面以外的任何其他页面上的行仍会将我发送到第一个页面。这似乎发生在任何setState
函数中,而像console.log()
或alert()
之类的函数都不会发生。还是不知道为什么会这样。