RecommBox 推荐组件

RecommBox 是 Indexea 用于显示推荐结果的 Web 组件，通过简单的几行代码，将推荐结果嵌入到你的网站中。RecommBox 是 Indexea 开源的 Widgets 项目的一部分，你可以在 Widgets 中查看更多 RecommBox 的使用方法。

基本示例：

import { RecommBox } from '@indexea/widgets'

const app = document.getElementById('app')

new RecommBox({
  target: app,
  props: {
    widget: '[recomm ident]',
    endpoint: 'https://api.indexea.com/v1', // Optional, change it in private cloud
    xxxx: xxxx // Other args
  }
})

如下图所示：

你可以定制每个推荐结果的渲染方式，以及推荐结果的数量，设置后可以直接在效果预览中进行测试。

你也可以在调用 RecommBox 时传入一个渲染函数，用于自定义推荐结果的渲染方式，如下所示：

import { RecommBox } from './main'
let endpoint = 'http://localhost:8080/v1'
let recomm = '6rcscdml8e9jqiwt1wuy'

function Render(item: any, url: string, i: number) {
  return `<div class='d-flex justify-content-between align-items-start'>
                <div class="ms-2 me-auto">
                <div class="fw-bold"><a href="${url}" target="_blank">${item.name}</a></div>
                ${item.description}
                </div>
                <span class="badge bg-primary rounded-pill">${item['count.star']}</span>
            </div>`
}

<RecommBox {endpoint} {recomm} render={Render} {...其他参数}/>