मैं त्रुटि हो रही हैचेतावनी: setState (...):/redux के साथ एक मौजूदा राज्य संक्रमण के दौरान अद्यतन नहीं कर सकते अपरिवर्तनीय
चेतावनी: setState (...): किसी मौजूदा राज्य संक्रमण के दौरान अद्यतन नहीं कर सकते (जैसे
render
या किसी अन्य घटक के कन्स्ट्रक्टर के भीतर)। रेंडर विधियों को प्रोप और राज्य का शुद्ध कार्य होना चाहिए; कन्स्ट्रक्टर दुष्प्रभाव एक विरोधी पैटर्न हैं, लेकिनcomponentWillMount
पर ले जाया जा सकता है।
मैंने पाया कारण
const mapStateToProps = (state) => {
return {
notifications: state.get("notifications").get("notifications").toJS()
}
}
होने के लिए मैं वहां सूचनाएं यह काम करता है वापसी नहीं है, तो। लेकिन वह क्यों है?
import {connect} from "react-redux"
import {removeNotification, deactivateNotification} from "./actions"
import Notifications from "./Notifications.jsx"
const mapStateToProps = (state) => {
return {
notifications: state.get("notifications").get("notifications").toJS()
}
}
const mapDispatchToProps = (dispatch) => {
return {
closeNotification: (notification) => {
dispatch(deactivateNotification(notification.id))
setTimeout(() => dispatch(removeNotification(notification.id)), 2000)
}
}
}
const NotificationsBotBot = connect(mapStateToProps, mapDispatchToProps)(Notifications)
export default NotificationsBotBot
import React from "react"
class Notifications extends React.Component {
render() {
return (
<div></div>
)
}
}
export default Notifications
अद्यतन
आगे डिबगिंग पर मैंने पाया कि, ऊपर सूचनाएं रहने सब के बाद, मैं हो सकता है मूल कारण नहीं हो सकता है, लेकिन मैं dispatch(push("/domains"))
मेरी रीडायरेक्ट निकाल की जरूरत है।
export function doLogin (username, password) {
return function (dispatch) {
dispatch(loginRequest())
console.log("Simulated login with", username, password)
setTimeout(() => {
dispatch(loginSuccess(`PLACEHOLDER_TOKEN${Date.now()}`))
dispatch(addNotification({
children: "Successfully logged in",
type: "accept",
timeout: 2000,
action: "Ok"
}))
dispatch(push("/domains"))
}, 1000)
}
}
मुझे लगता है कि प्रेषण चेतावनी का कारण बनता है, लेकिन क्यों:
यह मैं कैसे के लिए लॉग इन है?
import {connect} from "react-redux"
import DomainsIndex from "./DomainsIndex.jsx"
export default connect()(DomainsIndex)
DomainsIndex
export default class DomainsIndex extends React.Component {
render() {
return (
<div>
<h1>Domains</h1>
</div>
)
}
}
अद्यतन 2
मेरे App.jsx
: मेरे डोमेन पेज ज्यादा वर्तमान में कुछ भी नहीं है। <Notifications />
कौन-सी सूचनाएं
<Provider store={store}>
<ConnectedRouter history={history}>
<Layout>
<Panel>
<Switch>
<Route path="/auth" />
<Route component={TopBar} />
</Switch>
<Switch>
<Route exact path="/" component={Index} />
<Route path="/auth/login" component={LoginBotBot} />
<AuthenticatedRoute exact path="/domains" component={DomainsPage} />
<AuthenticatedRoute exact path="/domain/:id" component={DomainPage} />
<Route component={Http404} />
</Switch>
<Notifications />
</Panel>
</Layout>
</ConnectedRouter>
</Provider>
आप हमें खेलने के लिए के लिए एक रेपो के लिए कोड को अपलोड कर सकते हैं त्रुटि redux राज्य में एक अद्यतन ट्रिगर हो सकता है इसके साथ? इस सेटअप के साथ पता लगाना मुश्किल है। –
एक तरफ ध्यान दें, बल्कि .Get() का उपयोग करने से है। मिलता है() आप .getIn ([]) का उपयोग करना चाहिए। –
मेरे अनुभव में यह क्रियाओं की संरचना के बारे में नहीं है, बल्कि उस स्थान के बारे में अधिक है जहां से कार्यवाही शुरू हो जाती है।आम तौर पर आप 'घटकWillMount' या' रेंडर' से 'क्रिया को ट्रिगर करते समय यह त्रुटि देखते हैं। गलती से भी, उदा। जब 'onClick = {action}' के बजाय 'onClick = {action()} 'लिखते हैं। – Sulthan