0

我有 1 个带有一个或多个 taskTrees 的项目。

对于每个 taskTree，我有多个任务。

问题是每当我添加新任务时，在刷新页面之前我都看不到正在添加的任务。

我正在使用带有以下软件包的 Meteor React 1.2.1

react
kadira:flow-router
meteortoys:allthings
kadira:react-layout

我也有3个收藏。

Projects = new Mongo.Collection("projects")
TaskTrees = new Mongo.Collection("task-trees")
Tasks = new Mongo.Collection("tasks")

我的收藏结构如下所示：

**Projects**
_id
taskTrees: [taskTreeId]

**TaskTrees**
_id
tasks: [taskId]

**Tasks**
_id
title

我使用 FlowRouter 渲染 ProjectPage

FlowRouter.route('/project-page', {
    action(params, queryParams) {
        ReactLayout.render(ProjectPage)
    }
})

这是我的 3 个反应课程

ProjectPage = React.createClass({
    mixins: [ReactMeteorData],

    getMeteorData() {
        Meteor.subscribe('project-page')
        return {
            taskTrees: TaskTrees.find().fetch()
        }
    },

    renderTaskTrees() {
        if(this.data.taskTrees) {
            return this.data.taskTrees.map( (taskTree) => {
                return <TaskTree
                    key={taskTree._id}
                    taskTreeId={taskTree._id} />
            })
        }
    },

    render() {
        return(
            <div>
                RenderingTaskTree
                {this.renderTaskTrees()}
            </div>
        )
    }
})

TaskTree = React.createClass({
    mixins: [ReactMeteorData],

    getMeteorData() {
        Meteor.subscribe('task-tree', this.props.taskTreeId)
        return {
            tasks: Tasks.find().fetch()
        }
    },

    renderTasks() {
        if(this.data.tasks) {
            return this.data.tasks.map( (task) => {
                return <Task
                    key={task._id}
                    title={task.title} />
            })
        }
    },

    render() {
        return(
            <div>{this.renderTasks()}</div>
        )
    }
})

Task = React.createClass({
    render() {
        return(
            <div>
                <div>Title: {this.props.title}</div>
            </div>
        )
    }
})

这是我在服务器文件夹中的发布方法

Meteor.publish('project-page', () => {
    const project = Projects.findOne()
    if(project.taskTrees) {
        const taskTrees = TaskTrees.find({_id: {$in: project.taskTrees}})
        return taskTrees
    }
    this.ready()
})

Meteor.publish('task-tree', (taskTreeId) => {
    const taskTree = TaskTrees.findOne({_id: taskTreeId})
    if(taskTree.tasks) {
        const tasks = Tasks.find({_id: {$in: taskTree.tasks}})
        return tasks
    }
    this.ready()
})
4

1 回答 1

0

[ReactMeteorData]我认为将所需的订阅从所有组件中放入ProjectPage组件中，然后将反应数据传递props给它的子组件更有意义。

此外，您应该直接在发布函数中返回游标，如此处所述。

所以你的第一个发布函数现在看起来像这样：

if(project.taskTrees) {
    return TaskTrees.find({_id: {$in: project.taskTrees}});
}
于 2015-12-03T23:55:41.470 回答