Xrely Autocomplete

Xrely Autocomplete package gives you hessle free integration with your current React Project.

Install

npm install @xrely/react-autocomplete

Integration Code

App.js Define templete function

 function getDynamicTemplate (item){
    let img;
    if (item.schema && item.schema.thing && item.schema.thing.image) {
      img = <img style={{width:"48px"}} src={item.schema.thing.image} /> 
     }else{
       img = ""
     }
    return (
    <div>
      {img}
      <span>{item.keyword}</span>
    </div>)
  }

App.js Initialization code

      <div style={{maxWidth:600,textAlign:'center'}}>
        <Autocomplete config={{searchAPIKey:'b1f2364da3bcb2cef633e49cf7973b33'}} dynamicTemplate={getDynamicTemplate} />
      </div>

API Interface

Property	Description	Type
dynamicTemplate	Provide Template for sugession, For each suggestion this template will be rendered item variable will be available with data	Template
config	Config Json contains Public API key available under API key Section of your index. Sample JSON: {'seachAPIKey':'####SeachAPIKey###'}	JSON

Further Guide

Please feel free to contact us on info@xrely.com

Check out intergtaion page here