Question

我正在使用Meteor + React和＆＃34; this.props.thing.source＆＃34;是mongodb _id的字符串。

＆＃34; findOne（）＆＃34;功能是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（＆＃34; emq6M4WbJeRvkA6Q3＆＃34;）。data}

这正确呈现＆＃34; emq6M4WbJeRvkA6Q3＆＃34;：

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

我得到的错误：

＆＃34;未捕获的TypeError：无法读取属性＆＃39;数据＆＃39;未定义＆＃34;

Answer 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＆＃34; Uncaught TypeError：无法读取属性＆＃39;数据＆＃39;未定义＆＃34;

1 个答案: