-
Notifications
You must be signed in to change notification settings - Fork 49.3k
Closed
Labels
Status: UnconfirmedA potential issue that we haven't yet confirmed as a bugA potential issue that we haven't yet confirmed as a bug
Description
Upgrading meteor
(from 1.4 to 1.7) and react
(from 15.3.2 to 16.8.6) and got this warning at browser console:
Warning: Expected Container(Container(withRouter(List))) state to match memoized state before componentDidMount. This might either be because of a bug in React, or because a component reassigns its own `this.props`. Please file an issue.
in Container(Container(withRouter(List))) (created by UseDeps(Container(Container(withRouter(List)))))
in UseDeps(Container(Container(withRouter(List)))) (created by RouterContext)
in div (created by Layout)
in div (created by Content)
in Content (created by Layout)
in div (created by Layout)
in div (created by Layout)
in MDLComponent (created by Layout)
in Layout (created by Layout)
in Layout (created by WithDeps(Layout))
in WithDeps(Layout) (created by RouterContext)
in RouterContext (created by Router)
in Router
in Provider
in Unknown
Note: My codes ain't using react-css-modules
or having this.props = ...
syntax as suggested in #14224
React version: 16.8.6
Steps To Reproduce
Here is my code (which I have narrowed down to, likely at onPropsChange part)
list.js
import {useDeps, composeAll, compose} from 'mantra-core-extra';
import composeWithTracker from '../../core/libs/utils/compose-with-tracker';
import List from '../components/list.jsx';
import Tickets from '../../../../lib/collections';
const composer = ({context}, onData) => {
const {Meteor, Store} = context();
if (Meteor.subscribe('tickets').ready()) {
let filters = Object.assign({}, Store.getState().tickets.list.filters);
if (filters.date) {
filters['createdAt'] = {$gt: filters.date.range.start, $lt: filters.date.range.end};
delete filters['date'];
}
let total = Tickets.find(filters).count();
const tickets = Tickets.find(filters, {
sort: {[Store.getState().tickets.list.sort.field]: Store.getState().tickets.list.sort.order ? 1 : -1},
skip: Store.getState().tickets.list.page * Store.getState().tickets.list.range,
limit: Store.getState().tickets.list.range,
}).fetch();
onData(null, {tickets, total});
}
};
const onPropsChange = ({context}, onData) => {
const {Store} = context();
onData(null, Store.getState().tickets);
return Store.subscribe(() => {
onData(null, Store.getState().tickets);
});
};
const depsMapper = (context, actions) => ({
select: actions.ticket.select,
unselect: actions.ticket.unselect,
remove: actions.ticket.remove,
changePage: actions.ticket.changePage,
sortField: actions.ticket.sort,
changeCategory: actions.ticket.changeCategory,
changeStatus: actions.ticket.changeStatus,
changeDate: actions.ticket.changeDate,
find: actions.ticket.find,
context: () => context
});
export default composeAll(
composeWithTracker(composer),
compose(onPropsChange),
useDeps(depsMapper)
)(List);
The current behavior
Causing table listing not appearing in my case.
The expected behavior
Table with rows of data to be listed
rsshilli and robotrapta
Metadata
Metadata
Assignees
Labels
Status: UnconfirmedA potential issue that we haven't yet confirmed as a bugA potential issue that we haven't yet confirmed as a bug