Question

import { Mongo } from 'meteor/mongo';
import { Meteor } from 'meteor/meteor';
import React, {Component} from 'react';
import {check} from 'meteor/check';

export const Adressen = new Mongo.Collection('Phonebook');

if (Meteor.isServer) {

    Meteor.publish('ArrayToExport', function(branches) {
        check(branches, [Match.Any]);
        if(branches.length > 10){
            return this.ready()
        };
        return Adressen.find(
            {branche: {$in: branches}}, {fields: {firmenname:1, plz:1}}
        );
    });
}

import React, { Component } from 'react';
import { withTracker } from 'meteor/react-meteor-data';
import {Adressen} from "../api/MongoDB";

class ExportArray extends Component{
    constructor(props){
        super(props);

        this.state = {
            branches: this.props.filteredBranches
        };
    }

    render(){

        return(
            <div>
                <button onClick={this.exportArrays}></button>+
            </div>
        );
    }
}
export default withTracker( (branches) => {

    Meteor.subscribe('ArrayToExport', branches);
    return {
        ArrayToExport: Adressen.find({}).fetch()
    };
})(ExportArray);

this.props.filteredBranche 是一个纯数组，通过受控输入字段生成。在父组件中， this.props.filteredBranches 随着输入的变化而变化。我以为我是通过 withTracker 函数发送我的 this.props.filteredBranches 作为参数。但没有任何内容传递给发布功能。

if (Meteor.isServer) {
    arrayExfct = function (array){
        return {
            find: {branche:{$in: array }},
            fields: {firmenname:1, plz:1}
        };
    }

    Meteor.publish('ArrayToExport', function (array) {
        return Adressen.find(
            arrayExfct(array).find, arrayExfct(array).fields);
    });
}

export default withTracker( () => {

    arrayExfct = function(array) {
        return {
            find: {branche: {$in:  array}},
            fields: {firmenname:1, plz:1}
        }
    }

    var array = ['10555'];
    Meteor.subscribe('ArrayToExport', array );
    var arrayExfct = Adressen.find(arrayExfct(array).find, arrayExfct(array).fields);
    return {
        ArrayToExport: Adressen.find({}).fetch()
    };
})(ExportArray);

Answer 1

如果您还添加了使用此组件的位置以及如何将道具传递给它的示例，这会有所帮助，但我认为我看到了您的问题。

您希望渲染组件中的本地状态进入withTracker容器，但这是另一种方式。当您创建withTracker容器时，您实际上正在创建另一个反应组件，该组件呈现您的显示组件（ExportArray）并将数据（ArrayToExport）传递给它。

所以，道具现在这样：

外部渲染 - ＆gt; withTracker组件 - ＆gt; ExportArray

你需要做什么才能从withTracker中的props参数获取filteredBranches（你从父组件传递？）并将其传递给subscribtion，

class ExportArray extends Component{

    exportArrays () {
        const { ArrayToExport } = this.props;
    }

    render(){
        const { ArrayToExport } = this.props;
        return(
            <div>
                <button onClick={this.exportArrays}></button>+
            </div>
        );
    }

}

export default withTracker(propsFromParent => {
    const { filteredBranches } = propsFromParent;

    Meteor.subscribe('ArrayToExport', filteredBranches);

    return {
        ArrayToExport: Adressen.find({}).fetch()
    };
})(ExportArray);

Answer 2

嗨，问题在于下面的代码。名为branches的参数是props，所以branches.branches是你传入的数组。

    export default withTracker( (branches) => {

    Meteor.subscribe('ArrayToExport', branches);
    return {
        ArrayToExport: Adressen.find({}).fetch()
    };
})(ExportArray);

请尝试以下操作。

    export default withTracker( ({branches}) => {

    Meteor.subscribe('ArrayToExport', branches);
    return {
        ArrayToExport: Adressen.find({}).fetch()
    };
})(ExportArray);

注意所有改变的是

(branches)

成了

({branches})

试图将我的数组（props）作为选择器传递给我的发布函数

2 个答案: