1

我正在使用 Laravel Scout 和 alogolia 作为驱动程序。由于我在前端有 vue，所以我尝试了 vue 即时搜索包，效果非常好。

我面临的问题是我需要将其自定义为我们正在使用的应用内样式。

细化科

这是我要自定义的特定组件。它尝试了像它们在样式部分中显示的那样的类，但这对我来说并不适用，因为我需要在其中添加更多标签和属性。

<ais-refinement-list attribute-name="categories.title" inline-template>
      <div class="column w-1/5">
            Hello
      </div>
</ais-refinement-list>

现在我知道我可以像这样开始编写一个内联模板，但我还不明白如何获取改进的值，以便我可以制作复选框，以及如何在它们被选中后将它们发送回组件. 任何帮助表示赞赏。

4

1 回答 1

1

我在这里挖掘了它自己的包，然后在这里找到了模板。出于某种原因，我在供应商代码中看不到这一点。

从那里得到所有的变量和方法调用

这是自定义版本：

<ais-refinement-list attribute-name="categories.title" inline-template>
    <div class="column w-1/5">
        <h3>Categories</h3>
        <hr class="my-3">
        <div class='column w-full mb-4' v-for="facet in facetValues">
            <div class="checkbox-control mb-4">
                <input type="checkbox" :id="facet.name" :value="facet.name" v-model="facet.isRefined" @change="toggleRefinement(facet)"/>
                <label :for="facet.name">{{ facet.name }} ({{ facet.count }})</label>
            </div>
        </div>
    </div>
</ais-refinement-list>
于 2018-08-10T06:16:13.813 回答