使用地图在Redux Froms中渲染多个字段

Question

我正在使用API​​从数据库中获取数据，并且该响应具有名称，ID和图像URL。我需要使用此数据来生成复选框以获取用户输入。因此，我使用.map以redux形式生成多个复选框。但它不会出现在浏览器中。减速器工作良好，当我使用redux-forms时，这个问题越来越严重。

renderFieldCheckbox(field){
        const { meta: { touched, error } } = field;
        const className = `form-group ${touched && error ? "has-danger" : ""}`;

        return(
                <div class="form-group form-check">
                    <input type="checkbox" name="publishers" class="form-check-input" id={field.id} />
                    <label class="form-check-label" for="publisher1">
                        <img src={field.image} className="img-fluid" alt={field.name} />            

                    </label>
                </div>

        );

    }

render() {
        const { handleSubmit } = this.props;
        return (
            <row>
              <form className="mt-3" onSubmit={handleSubmit(this.onSubmit.bind(this))}>
                {
                    this.props.publisherFilter&&this.props.publisherFilter.map((publisher, index) =>{ 
                        console.log("Field here ------");
                        let imgurl = require(`../assets/img/${publisher.image}`);
                        return( 
                            <Col xs="6" lg="3">
                              <Field 
                            id = {publisher.id}
                            name = {publisher.name}
                            image = {imgurl}
                            Component = {this.renderFieldCheckbox}
                                />
                            </Col>
                        );
                }  )}

            </form>

          </row>
        );
    }