2016-12-09 48 views
1

我試圖使用react-native獲得新的Algolia react-instantsearch組件。使用Algolia與react-native進行即時搜索

我一直在關注guide,我完全被卡住了。

基本上,只要我嘗試添加<InstantSearch />組件內我<SearchBox />成分,我的應用程序預計組件類死了,得了的翻譯:

據我所知,我將<SearchBox />連接到connectSearchBox連接器,所以我不知道發生了什麼事情。

代碼(我有APPID,apiKey,&指數實際值):

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, 
    }, 
}); 
+0

這肯定與我所看到的導向相匹配?它在哪裏說的錯誤是什麼? –

+0

@MattAft堆棧跟蹤不指向我的代碼中特定的任何東西。以'' - >'createInternalComponent' - >'instantiateReactComponent' - >'peformInitialMount'開始,但是繼續進行內部React內容的頁面和頁面。 –

+0

雖然這肯定是由中的''組件造成的。如果我刪除,沒有錯誤。 –

回答

0

嘗試在搜索盒包裝了TextInput:

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

仍會引發相同的錯誤 –