Feature: Changing defaultSorting now updates the sorting model

This commit is contained in:
Tanner Linsley 2017-03-01 15:50:36 -07:00
parent f296b075fe
commit 9e95b331df
6 changed files with 17 additions and 12 deletions

View File

@ -16,7 +16,7 @@
<body>
<div id="root"></div>
<div id="error-display"></div>
<script src="static/preview.7549a2f8d9b5e6663c7a.bundle.js"></script>
<script src="static/preview.742092f25ec9b6802477.bundle.js"></script>
</body>
</html>

View File

@ -1 +1 @@
{"version":3,"file":"static/preview.7549a2f8d9b5e6663c7a.bundle.js","sources":["webpack:///static/preview.7549a2f8d9b5e6663c7a.bundle.js"],"mappings":"AAAA;AAkuDA;AAo8CA;AA8uGA;AA++EA;AAi9NA;AAo5GA;AAmvDA;AAmgEA;AA4xDA;AAigEA;AAmjDA;AA4sDA;AAk8CA;AAu/DA;AA8lDA;AA09CA;AAqoDA;AAywEA;AAokDA;AAsvCA;AA2mDA;AA4tDA;AAqjEA;AAs2DA;AAmyDA;AAsnDA;AAk1EA;AAmjGA;AA4tDA;AA82CA;AAg5BA;AAq0DA;AA26BA;AAuOA;AAw5EA","sourceRoot":""}
{"version":3,"file":"static/preview.742092f25ec9b6802477.bundle.js","sources":["webpack:///static/preview.742092f25ec9b6802477.bundle.js"],"mappings":"AAAA;AAkuDA;AAo8CA;AA8uGA;AA++EA;AAi9NA;AAo5GA;AAmvDA;AAmgEA;AA4xDA;AAigEA;AAmjDA;AA4sDA;AAk8CA;AAu/DA;AA8lDA;AA09CA;AAqoDA;AAywEA;AAokDA;AAsvCA;AA2mDA;AA4tDA;AAqjEA;AAs2DA;AAmyDA;AAsnDA;AAk1EA;AAmjGA;AAiuDA;AA+2CA;AAq5BA;AA4zDA;AA26BA;AAuOA;AAw5EA","sourceRoot":""}

View File

@ -26,7 +26,7 @@ export default {
},
componentWillMount () {
this.setStateWithData(this.getDataModel())
this.setStateWithData(this.getDataModel(this.getResolvedState()))
},
componentDidMount () {
@ -37,6 +37,10 @@ export default {
const oldState = this.getResolvedState()
const newState = this.getResolvedState(nextProps, nextState)
if (oldState.defaultSorting !== newState.defaultSorting) {
newState.sorting = newState.defaultSorting
}
// Props that trigger a data update
if (
oldState.data !== newState.data ||
@ -44,7 +48,7 @@ export default {
oldState.pivotBy !== newState.pivotBy ||
oldState.sorting !== newState.sorting
) {
this.setStateWithData(this.getDataModel(nextProps, nextState))
this.setStateWithData(this.getDataModel(newState))
}
},

View File

@ -1,7 +1,7 @@
import _ from './utils'
export default {
getDataModel (nextProps, nextState) {
getDataModel (newState) {
const {
columns,
pivotBy = [],
@ -14,7 +14,7 @@ export default {
page,
pages,
pageSize
} = this.getResolvedState(nextProps, nextState)
} = newState
// Determine Header Groups
let hasHeaderGroups = false
@ -219,6 +219,7 @@ export default {
const newPage = page > newPages ? newPage - 1 : page
return {
...newState,
resolvedData,
pivotColumn,
allVisibleColumns,

View File

@ -48,13 +48,13 @@ const ServerSide = React.createClass({
}
},
fetchData (state, instance) {
console.log(state, instance)
// Whenever the table model changes, or the user sorts or changes pages, this method gets called and passed the current table model.
// You can set the `loading` prop of the table to true to use the built-in one or show you're own loading bar if you want.
this.setState({loading: true})
// Request the data however you want. Here, we'll use our mocked service we created earlier
requestData(state.pageSize, state.page, state.sorting)
.then((res) => {
console.log(res.rows)
// Now just get the rows of data to your React Table (and update anything else like total pages or loading)
this.setState({
data: res.rows,