Reactjs React Native Algolia即时搜索&；搜索框

在遵循Algolia docs（）设置对Alogila索引的简单搜索时，使用以下代码

import React, {Component} from 'react';
import ReactDOM from 'react-dom';
import {Text, View, StyleSheet, Button, TextInput} from 'react-native';
import algoliasearch from 'algoliasearch/lite';
import { InstantSearch, Index, SearchBox, Hits } from 'react-instantsearch-dom';


const searchClient = algoliasearch(
    '**********', //app ID
    '************************' //app key
);

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

    }

    render(){
        return (
            <View style={{
                flex: 1,
                alignItems: "center",
                flexDirection: "column",
                paddingTop: 20
              }}>
            <InstantSearch
                searchClient={searchClient}
                indexName="dev_INVENTORY">
                    <SearchBox/>
            </InstantSearch>
            </View>
    )}

};

const styles = StyleSheet.create({});

export default MyApp;

import React，{Component}来自'React'；
从“react dom”导入react dom；
从“react native”导入{Text，View，StyleSheet，Button，TextInput}；
从'algoliasearch/lite'导入algoliasearch；
从'react InstantSearch dom'导入{InstantSearch，Index，SearchBox，Hits}；
const searchClient=algoliasearch(
“*******”，//应用程序ID
“*******************”//应用程序密钥
);
类MyApp扩展组件{
建造师（道具）{
超级（道具）；
}
render（）{
返回(
)}
};
constyles=StyleSheet.create（{}）；
导出默认MyApp；

我得到错误“未找到名称输入的不变冲突：视图配置”。确保组件名称以大写字母开头

此错误位于输入中（由Searchbox创建）…'

当我删除搜索框代码时，应用程序运行正常，但一旦我添加它，我就会遇到错误，但很明显，所有元素都正确大写（除非我做了一个可笑的疏忽！） 我想知道这个错误是否与这个人的问题有关； 但我不这么认为

---

如果有人有任何建议，我可以开始搜索Algolia，这将是ace，因为我有点卡住了

问题是您试图使用来自

react instantsearch dom

的一些小部件，这些小部件与react Native不兼容

对于React Native，您需要使用连接器而不是小部件：

在您的情况下，它应该为您提供如下信息：

import React，{Component}来自'React'；
从“道具类型”导入道具类型；
从“react native”导入{View，StyleSheet，TextInput}；
从'algoliasearch/lite'导入algoliasearch；
从“react InstantSearch native”导入{InstantSearch，connectSearchBox}；
const searchClient=algoliasearch(
“*******”，//应用程序ID
“*******************”//应用程序密钥
);
类SearchBox扩展组件{
render（）{
返回(
this.props.refine（text）}
值={this.props.currentRefineration}
占位符={“搜索产品…”
clearButtonMode={'always'}
拼写检查={false}
自动更正={false}
自动资本化={'none'}
/>
);
}
}
SearchBox.propTypes={
优化：需要PropTypes.func.isRequired，
当前优化：PropTypes.string，
};
const ConnectedSearchBox=connectSearchBox（SearchBox）；
类MyApp扩展组件{
建造师（道具）{
超级（道具）；
}
render（）{
返回(
);
}
}
constyles=StyleSheet.create（{}）；
导出默认MyApp；

为了添加，我还尝试删除了“”，刚开始使用InstantSearch，但仍然不幸运。注意，我也在使用Expo，但从我在网上看到的Algolia和Expo玩得非常好。我没有得到任何结果，但是，在Algolia仪表板中获得搜索计数