Question

我正在开发一个用户可以发表评论的应用，其他人可以回复他们的评论（回复）。

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

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

＆＃13;

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

＆＃13;

这是子组件replyDetail.jsx

＆＃13;

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)

＆＃13;

这就是我得到的错误。

警告：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)

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

1 个答案: