mobx：array.map（）不是一个函数

我创建使用mobx商店如下：mobx：array.map（）不是一个函数

import {extendObservable} from 'mobx'; 

class InfluencerFeedStore { 
    constructor() { 
     extendObservable(this, { 
      data: [] 
     }); 
    } 

    setData(items = []) { 
     this.data = items; 
    } 
} 

export default new InfluencerFeedStore();

然后我观察到店我阵营的观点：

import React from 'react'; 
import {observer} from 'mobx-react'; 
import FeedItem from './FeedItem'; 
import InfluencerFeedStore from '../../core/stores/InfluencerFeed'; 

import './style.css'; 

const generateItems =() => { 
    return InfluencerFeedStore.data.map((item, i) => (
     <FeedItem key={`feeditem-${i}`} {...item} /> 
    )); 
}; 

const Feed =() => (
    <div className="Feed vertical-scroll-flex-child"> 
     {generateItems()} 
    </div> 
); 

export default observer(Feed);

在第一次渲染，我的Feed视图工作得很好（虽然在InfluencerFeedStore.data阵列中没有项目）。

如果我以后通过调用InfluencerFeedStore.setData()加载项，将作出反应正确试图重新呈现Feed视图（因为它注意到观察到的更新mobx）...但我得到一个错误，抱怨InfluencerFeedStore.data.map is not a function。

通过阅读mobx文档，我收集到重新分配我的data属性是有问题的，因为它是一个数组（而其他数据类型像字符串“只是工作”）。任何人都可以告诉我我在这里做错了什么？

来源

2016-12-01 arthurakay

完全是为了我自己的熏陶，你似乎是访问以静态方式将数据VAL，而不是从类的实例（数据在构造函数中初始化）。这可以吗？ ObservableFeed将代表一个实例。 –

确实，构造函数从来没有被调用，所以这不起作用。应该首先实例化商店 – mweststrate

所以，事实证明，我有两个问题：

我需要使用的replace()方法覆盖observable array，而不是试图完全重新分配一个新的值
我本来就不是将数组传递给我的setData()方法;这就是为什么我打的“地图是不是一个函数”错误

它应该是这样的：

import {extendObservable} from 'mobx'; 

class InfluencerFeedStore { 
    constructor() { 
     extendObservable(this, { 
      data: [] 
     }); 
    } 

    setData(items = []) { 
     this.data.replace(items); 
    } 
} 

export default new InfluencerFeedStore();

来源

2016-12-01 16:23:49 arthurakay

问题是（我认为基于我的评论）你没有从类的实例中访问“数据”，你正在静态访问它，所以类的构造函数永远不会运行，并且“数据”永远不会运行初始化。 “ObservableFeed”是一个实例。

来源

2016-12-01 14:49:14

我认为这是不对的。在我的商店文件中，我导出的唯一东西是'导出默认的ObservableFeed' - 所以当我导入InfluencerFeedStore时，它引用同一个实例对象（它只是重命名）。除非我完全误解了ES2015（这是可能的！） – arthurakay

嗯......但是你不想导入导出的成员（这将是一个实例）？我对ES6模块的理解有点不稳定，因为我使用的构建器不支持它们。但是从你所说的话，你可以导出一个东西（ObervableFeed），导入另一个（InfluencerFeedStore），并且通过这样做，以某种方式隐式地获得ObervableFeed的行为？ –

我发现这似乎是凝胶： “只能有一个默认的导出，这主要用于导出单个东西，比如一个类，或者一个你希望没有任何附加功能的单个函数当你导入一个默认导出模块时，使用c中的import d。“ 这是否意味着从'./etc/InfluencerFeed'导入ObservableFeed？ –

mobx：array.map（）不是一个函数

回答

相关问题