文章/答案/技术大牛

发布

社区首页 >问答首页 >无法读取Javascript类中未定义的属性“存储”

问无法读取Javascript类中未定义的属性“存储”
EN

Stack Overflow用户

提问于 2019-05-20 21:24:58

回答 2查看 8.2K关注 0票数 1

我编写了一个小型的方便类来集中处理我们在应用程序中所做的所有电子邮件验证。

但是，当我运行这个程序时，我会得到一个控制台错误：

无法读取未定义的属性“存储”

我在这里显然遗漏了一个导入，但不清楚如何导入store。我的直觉告诉我我在做错事。在做了四年的移动之后回到网络，所以我有点生疏了:)

谢谢

import React from 'react';
import { connect } from 'react-redux';
import { checkEmail } from 'app/auth/redux/actions.js';

class EmailValidator extends React.Component {
  constructor(props) {
    super(props);
    // via: https://stackoverflow.com/a/13178771/602210
    this.regex = /^[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?$/i;
  }

  // Tests whether the email is in a valid format like name@example.com
  emailIsValid(email) {
    return this.regex.test(email);
  }

  * loginEmailExists(email) {
    const { emailIsTaken } = yield this.props.checkEmail(email);
    return emailIsTaken;
  }
}

const mapDispatchToProps = dispatch => {
  return {
    checkEmail: (email) => dispatch(checkEmail(email)),
  };
};

export default connect(null, mapDispatchToProps)(EmailValidator);

然后是另一个组件中的实现：

import EmailValidator from 'app/helpers/EmailValidator';

组件中较低的部分，在一个函数中：

const validator = new EmailValidator();
if (!validator.emailIsValid(email)) { ... } // throws error below

全误差

connectAdvanced.js:123 Uncaught TypeError: Cannot read property 'store' of undefined
    at new Connect (connectAdvanced.js:123)
    at eval (index.js:149)
    at HTMLUnknownElement.callCallback (react-dom.development.js:149)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:199)
    at invokeGuardedCallback (react-dom.development.js:256)
    at invokeGuardedCallbackAndCatchFirstError (react-dom.development.js:270)
    at executeDispatch (react-dom.development.js:561)
    at executeDispatchesInOrder (react-dom.development.js:583)
    at executeDispatchesAndRelease (react-dom.development.js:680)
    at executeDispatchesAndReleaseTopLevel (react-dom.development.js:688)
Connect(EmailValidator) @ connectAdvanced.js:123
(anonymous) @ index.js:149
callCallback @ react-dom.development.js:149
invokeGuardedCallbackDev @ react-dom.development.js:199
invokeGuardedCallback @ react-dom.development.js:256
invokeGuardedCallbackAndCatchFirstError @ react-dom.development.js:270
executeDispatch @ react-dom.development.js:561
executeDispatchesInOrder @ react-dom.development.js:583
executeDispatchesAndRelease @ react-dom.development.js:680
executeDispatchesAndReleaseTopLevel @ react-dom.development.js:688
forEachAccumulated @ react-dom.development.js:662
runEventsInBatch @ react-dom.development.js:816
runExtractedEventsInBatch @ react-dom.development.js:824
handleTopLevel @ react-dom.development.js:4826
batchedUpdates$1 @ react-dom.development.js:20233
batchedUpdates @ react-dom.development.js:2151
dispatchEvent @ react-dom.development.js:4905
(anonymous) @ react-dom.development.js:20284
unstable_runWithPriority @ scheduler.development.js:255
interactiveUpdates$1 @ react-dom.development.js:20283
interactiveUpdates @ react-dom.development.js:2170
dispatchInteractiveEvent @ react-dom.development.js:4882

react-dom.development.js:289 Uncaught TypeError: Cannot read property 'store' of undefined
    at new Connect (connectAdvanced.js:123)
    at eval (index.js:149)
    at HTMLUnknownElement.callCallback (react-dom.development.js:149)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:199)
    at invokeGuardedCallback (react-dom.development.js:256)
    at invokeGuardedCallbackAndCatchFirstError (react-dom.development.js:270)
    at executeDispatch (react-dom.development.js:561)
    at executeDispatchesInOrder (react-dom.development.js:583)
    at executeDispatchesAndRelease (react-dom.development.js:680)
    at executeDispatchesAndReleaseTopLevel (react-dom.development.js:688)

react-redux

javascript

reactjs

回答 2

Stack Overflow用户

回答已采纳

发布于 2019-05-20 22:04:51

不确定你是否正确地设置了商店，甚至已经设置好了。但这里有一个例子说明了你如何做到这一点：

// src/store.js
import { createStore } from 'redux'
import reducer from './reducers'

const enhancer = window.__REDUX_DEVTOOLS_EXTENSION__ &&window.__REDUX_DEVTOOLS_EXTENSION__() // Redux DevTools, a must

const store = createStore(reducer, enhancer)

export default store

// src/index.js
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';
import store from './store'
import {Provider} from 'react-redux'

ReactDOM.render(
    <Provider store={store}>
        <App />   
    </Provider>

, document.getElementById('root'));
registerServiceWorker();

请记住使用React.Component扩展类，例如：

import React from 'react';
...
class EmailValidator extends React.Component {
...

希望这能让你走上正轨。您的调度和连接语法很好，所以这至少不是问题所在。

票数 1

Stack Overflow用户

发布于 2019-05-20 22:05:09

不能导入store --需要提供<Provider/>

使简单的redux项目先运行。

你和redux一起工作过吗？

您不能将connect redux存储到任何类，它是一个特殊的组件增强器。

您的EmailValidator也可以是临时的。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/56228368

复制

相似问题

问无法读取Javascript类中未定义的属性“存储”
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问无法读取Javascript类中未定义的属性“存储”EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问无法读取Javascript类中未定义的属性“存储”
EN