流星反应将变量传递给子容器

Question

我正在开发一个应用程序，用户可以在其中制作 cmets，其他人可以回复他们的评论（回复）。

我的问题是，当我将 commentId 传递给 ReplyDetail 组件（子组件）时，我无法在 createContainer 中将 commentId 作为 prop 访问 - 我只能在组件中访问它。我正在通过 cmets 循环（地图）。

这就是我从 commentContent.jsx（在 map 函数内部）传递变量的方式

<div className="section">
    <ReplyDetail commentId={comment._id} 
</div>

这是子组件replyDetail.jsx

import { Meteor } from 'meteor/meteor';
import React, { Component } from 'react';
import { createContainer } from 'meteor/react-meteor-data';

import { Comments } from '../../../imports/collections/groupMethods';

class ReplyDetail extends Component {

	render() {

		//this works
		const commentId = this.props.commentId;
		console.log('this.props.commentId ' + this.props.commentId);

		return(
		    	<div>{commentId}</div>
	       )
	}
}

export default createContainer((props) => {
	Meteor.subscribe('comments');

	//this doesn't work
		const commentId = this.props.commentId;
		console.log('this.props.commentId-2 ' + this.props.commentId);
  return { 
     };
}, ReplyDetail)

这是我得到的错误。

警告：React 性能存在内部错误 测量代码。没想到 componentDidMount 计时器启动 而componentWillMount计时器仍在进行中 实例。

我需要回复是反应性的，那么如何将 commentId（props）直接传递给容器 - 或者如何将 commentId 从组件传递给容器？

Answer 1

是的，它不起作用，因为您的 createContainer 函数已经收到参数 (props) 中的道具，所以您不需要 this. 这应该可以解决：

import { Meteor } from 'meteor/meteor';
import React, { Component } from 'react';
import { createContainer } from 'meteor/react-meteor-data';
import { Comments } from '../../../imports/collections/groupMethods';

class ReplyDetail extends Component {

render() {
    const {commentId} = this.props;
    console.log('commentId', commentId);
    return (
        <div>{commentId}</div>
    )
  }
}

export default createContainer((props) => {
    Meteor.subscribe('comments');
    const commentId = props.commentId;
    console.log('commentIdFromContainer', commentId);
  return { 

  };
}, ReplyDetail)