将 Algolia react-instantsearch 与 react-native 结合使用 [英] Using Algolia react-instantsearch with react-native

问题描述

我正在尝试使用新的 Algolia react-instantsearch 组件反应原生.

I'm trying to get the new Algolia react-instantsearch component using react-native.

我一直在关注 指南 并且我完全卡住了.

I've been following the guide and I'm completely stuck.

基本上，每当我尝试将 <SearchBox/> 组件添加到 <InstantSearch/> 组件中时，我的应用程序都会以 需要一个组件类，得到 [object Object].

Basically, anytime I try to add my <SearchBox /> component inside the <InstantSearch /> component, my app dies with a Expected a component class, got [object Object].

据我所知，我正在将 连接到 connectSearchBox 连接器，所以我不确定发生了什么.

As far as I can tell, I'm wiring up <SearchBox /> to the connectSearchBox connector so I'm not sure what's going on.

代码(我确实有 appId、apiKey 和索引的实际值):

Code (I do have real values for appId, apiKey, & index):

import React, {Component} from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View,
  ListView,
  TextInput,
  Image,
} from 'react-native';
import {InstantSearch} from 'react-instantsearch/native';
import {connectSearchBox} from 'react-instantsearch/connectors';
import * as Styles from '../../styles/';

const SearchBox = connectSearchBox(({currentRefinement, refine}) =>
  <TextInput
    style={{height: 40, borderColor: 'gray', borderWidth: 1}}
    onChangeText={(text) => refine(text)}
    value={currentRefinement}
  />);

export default class InfiniteSearch extends Component {
  constructor(props) {
    super(props);
  }

    render() {
        return (
            <View style={styles.container}>
              <InstantSearch
                className="container-fluid"
                appId="appId"
                apiKey="apiKey"
                indexName="indexName"
              >
                <SearchBox />
              </InstantSearch>
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
      padding: 10,
    },
});

推荐答案

这个问题现在在 2.0.1 中解决了:https://github.com/algolia/instantsearch.js/blob/e15d37362fcd1eb60b5476307160062321983f09/CHANGELOG112d1#CHANGELOG112d1#>

this is now solved in 2.0.1: https://github.com/algolia/instantsearch.js/blob/e15d37362fcd1eb60b5476307160062321983f09/CHANGELOG.md#201-2016-12-15

谢谢！

这篇关于将 Algolia react-instantsearch 与 react-native 结合使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！