流星+反应“未捕获的类型错误：无法读取未定义的属性'数据'”答案

【问题标题】：meteor + react "Uncaught TypeError: Cannot read property 'data' of undefined"流星+反应“未捕获的类型错误：无法读取未定义的属性'数据'”
【发布时间】：2015-11-08 01:17:27
【问题描述】：

我使用 Meteor + React 并且“this.props.thing.source”是一个 mongodb _id 的字符串。

“findOne()”函数是 Meteor 的函数之一。正如您所看到的，当我传入 ID 本身的字符串时它工作正常，但是在传入变量时我得到一个未定义的错误，即使该变量呈现出相同的字符串。

在此代码中：

Thing = React.createClass({
  propTypes: {
    thing: React.PropTypes.object.isRequired
  },
  render() {
    return (
      <ul>
        <li>Display: {Things.findOne(this.props.thing.source).data}</li>
        <li>Display: {Things.findOne("emq6M4WbJeRvkA6Q3").data}</li>
        <li>Source: {this.props.thing.source}</li>
      </ul>
    );
  }
});

这不起作用：

显示：{Things.findOne(this.props.thing.source).data}

这行得通：

显示：{Things.findOne("emq6M4WbJeRvkA6Q3").data}

这会正确呈现“emq6M4WbJeRvkA6Q3”：

来源：{this.props.thing.source}

我得到的错误：

"Uncaught TypeError: Cannot read property 'data' of undefined"

【问题讨论】：

可能是因为this.props.thing.source不等于那个哈希码，也就是说findOne返回undefined，所以访问data属性会抛出错误。
刚刚想通了，它与不等于字符串有关...我发现并非所有的事物都有.source的值，所以有些是未定义的...现在我首先检查是否有字符串值，然后才执行查找。
这正是我的意思。当您使用硬编码字符串时，findOne 返回一个具有data 属性的对象。但是，当您使用变量时，findOne 正在返回 undefined，因此出现错误。

标签： javascript meteor reactjs

【解决方案1】：

您收到错误是因为 Things.findOne() 返回的是 undefined。

您说使用 this.props.thing.source 调用上述函数不起作用，这是错误的，但由于您没有提到您的 Thing 组件的渲染是如何发生的，因此您最好找到错误的方式是您的方式'正在传递道具this.props.thing.source/你传递给你的组件的东西。

我制作了一个快速复制粘贴示例来说明并让您的组件在 JSFiddle 中工作

var Things = {
    findOne: function (thingSource) {
        if (thingSource) {
            return {
                data: 'It did work!'
            };
        }
        return undefined;
    }
}

var Thing = React.createClass({
    propTypes: {
        thing: React.PropTypes.object.isRequired
    },
    render: function() {
        return <div>Hello {Things.findOne(this.props.thing.source).data}</div>;
    }
});

React.render(<Hello thing={{source: true}} />, document.body);

使用您的确切组件的工作示例可以是 found here

【讨论】：

查看了这个并用一些细节更新了我的问题。我使用 Meteor+React，所以“Things”是 Meteor 定义的 Mongo 集合，“findOne()”是提供的函数，而不是我创建的函数。 “this.props.thing.source”是一个包含 Mongo _id 字符串的变量。它正确地呈现了一个_id的字符串，但是当我使用这个变量时，查找函数不起作用，我得到数据属性的未定义错误。
刚刚弄明白了，它与字符串有关...我发现并非所有的东西都有.source的值，所以有些是未定义的...现在我正在检查如果先有字符串值，然后才执行查找。