无法读取不可变记录中的列表条目

Question

我对不可变记录和列表还是有点陌生，但这真的让我感到困惑。我有一个记录，里面有一个列表。列表中有 3 个条目。我能够使用点符号非常简单地访问 3 个中的 2 个。但是无论我做什么，其中一个似乎是未定义的，甚至知道我可以在组件的记录中看到它。下面是我尝试使用它的无状态功能组件中记录的控制台日志。

这里是相关记录

console.log("PHOTO0::",competitor);

returns

console.log("PHOTOIMAG::",competitor.imageLink);

returns

PHOTOIMAG:: https://testcreative.co.uk/wp-content/uploads/2017/10/Test-Logo-Circle-black-transparent.png

和

console.log("PHOTOKEY::",competitor.key);

returns

PHOTOKEY:: -LCK49TfAVBPBATG1oxp

但是

console.log("PHOTODESC::",competitor.description)

returns

PHOTODESC:: undefined

我已经将我的道具传递到我的功能组件中，并像这样连接了一个名为竞争对手的道具类型。

Photo.propTypes = {
competitor: PropTypes.object.isRequired
}

在我的函数中

function Photo({competitor}) {

所以我可以像这样在 return 中的条目上使用点符号，但它只适用于 ImageLink。

            <img className="photo" src={competitor.imageLink} alt={competitor.description} />

{competitor.imagLink} 有效。我的照片呈现在页面上。但是我没有对它们的描述，即使我可以看到它们在记录中有描述条目（在控制台图像上方）。

我已经尝试了这些我不应该需要的，因为我是唱片。

console.log("PHOTODESC::",competitor.get('description'));
console.log("PHOTODESC::",competitor.getIn(["description",0]))

我刚刚得到 'undefined'。所以看起来很奇怪我访问其他条目没有问题，但描述。我不了解我的不可变记录中的这些列表条目以及我如何使用它们吗？

Im React ^15.6.1，redux ^3.7.1，immutable ^3.8.1 使用最新的 chrome 浏览器。环顾四周，并未能在网上找到类似的问题。非常感谢任何帮助。

**在此处添加请求的代码******

我的竞争对手减速机。这主要是来自待办事项的样板，所以这可能是我的问题。

export const CompetitorsState = new Record({
deleted: null,
filter: '',
list: new List(),
previous: null
});

export function competitorsReducer(state = new CompetitorsState(), {payload, type}) {
 switch (type) {
case CREATE_COMPETITOR_SUCCESS:
  return state.merge({
    deleted: null,
    previous: null,
    list: state.deleted && state.deleted.key === payload.key ?
          state.previous :
          state.list.unshift(payload)
  });

case REMOVE_COMPETITOR_SUCCESS:
  return state.merge({
    deleted: payload,
    previous: state.list,
    list: state.list.filter(competitor => competitor.key !== payload.key)
  });

case FILTER_COMPETITORS:
  return state.set('filter', payload.filterType || '');

case LOAD_COMPETITORS_SUCCESS:
  return state.set('list', new List(payload));


default:
  return state;
}

相关行动

export const Competitor = new Record({
    decription: null,    
    imageLink: null,
    key: null,
});

export const competitorList = new FirebaseList({
    onAdd: createCompetitorSuccess,
    //onChange: updateTaskSuccess,
    onLoad: loadCompetitorsSuccess,
    onRemove: removeCompetitorSuccess
}, Competitor);




export function loadCompetitors() {
    return (dispatch, getState) => {
          const { auth } = getState();
          competitorList.path = `competitors/${auth.id}`;
          competitorList.subscribe(dispatch);
    };
}

export function loadCompetitorsSuccess(competitors) {
    return {
        type: types.LOAD_COMPETITORS_SUCCESS,
        payload: competitors
     };
}

export function createCompetitor(imageLink, description) {
      console.log("ACTION_CREATECOMESTART::", imageLink)
      console.log("ACTION_CREATECOMESTART2::", description)
      return dispatch => {
        competitorList.push({ description,imageLink })
        .catch(error => dispatch(createCompetitorError(error)));
      };
}

export function createCompetitorSuccess(competitor) {
    console.log("ACTION_CREATECOMESTARTSUCCESS::",competitor)
    return {
      type: types.CREATE_COMPETITOR_SUCCESS,
      payload: competitor
    };
 }

Answer 1

所以我终于找到了。这是我在实例化记录时的错字。我在我的记录中的描述中遗漏了一个 's' ，这把整个事情搞砸了。

这就是我的那个不好的

export const Competitor = new Record({
decription: null,    
pic: null,
key: null,  
});

应该是，

export const Competitor = new Record({
description: null,    
pic: null,
key: null,  
});

在我上面的控制台日志中的这张图片中，它一直都在那里，我错过了它，因为我正确地进入了我的数据库并且它正确地显示在我的列表条目中。

希望这对以后的人有所帮助！

无法读取不可变记录中的列表条目

Can't read list entry in immutable record

list

reactjs

immutable.js

redux