找英文例句？ELT search肯定够了！剑桥牛津朗文麦克米伦韦氏高阶都有了~

mikeee · 发表于 2021-10-30 23:35:00

本帖最后由 mikeee 于 2021-10-31 09:23 编辑

牛江浦发表于 2021-10-28 15:288 w( [( U8 u( p1 H1 { y; [: v* w
你好，搜索结果中左侧的分红框是比较碍眼，是开源软件本身设定的，我不太懂前端，所以暂时没找到修改的方 ...

我搓了个 vue2 搜索模板 https://github.com/ffreemt/meilisearch-plaintext。计算机里装了 node 的话（需要用到 npm 或 yarn装包）照读我文件里的步骤就可以设置好。有什么问题可跟帖，我尽量解答——我也不是折腾前端的。

mikeee · 发表于 2021-10-31 11:10:51

mikeee 发表于 2021-10-30 23:35& v, }6 D$ I$ L/ @0 W
我搓了个 vue2 搜索模板 https://github.com/ffreemt/meilisearch-plaintext。计算机里装了 node 的话（ ...

加了一个纯 js 版，无需node环境。只需两个文件（index.html 和 app.js, 其实可以整成一个文件）。参看https://github.com/ffreemt/meilisearch-plaintext读我文件的最后一条。

index.html

<!DOCTYPE html>
& ~# D! }' d8 J5 s
<html lang="en">
; D& ~0 F! T( X/ h( \, q+ c! a% B% L
<head>8 m- Z# P4 c5 R( B. |( C- o; m/ w
<meta charset="utf-8" />
9 e1 n' K' p+ x/ |
</head>
+ L9 k4 q0 ~* W4 s5 i; ]
2 T! Y8 _5 z6 |/ Y( x. X
<body>3 @+ c0 \3 ?& m1 O. N
<div>
5 |0 v9 s# ~' A
<div id="searchbox"></div>
# b: O( n9 `0 O2 \+ ]; |; ]
<div id="hits"></div>
2 q" k2 w4 a7 N
</div>
! O: k0 I7 _0 r* t# V2 f
3 F; u( ]5 B5 }& v; j
<script src="https://cdn.jsdelivr.net/npm/@meilisearch/instant-meilisearch/dist/instant-meilisearch.umd.min.js"></script>$ f$ N0 L: n6 c/ V* E1 h
<script src="https://cdn.jsdelivr.net/npm/instantsearch.js@4"></script>
( n5 D6 s" x# g' I
<script src="./app.js"></script>; P9 B5 ?: }' V$ O/ k! \; G
</body>: [; h/ F/ N2 X$ Y' |* n
</html>

复制代码

app.js

const search = instantsearch({0 t7 l3 ]) A5 S/ H
// indexName: 'steam-video-games',
2 b# u6 G8 r' S3 s( s
indexName: 'movies',
; H+ ? i) p5 V7 j% a$ d
searchClient: instantMeiliSearch(6 o/ j5 p8 g6 G" t
// 'https://demos.meilisearch.com',
; A ?+ L7 L" k) u9 X& U% x4 q$ b
'http://acone3:7700',) g" {6 v7 \" Y% b1 Z: L6 W$ R
'dc3fedaf922de8937fdea01f0a7d59557f1fd31832cb8440ce94231cfdde7f25'
2 ^ p+ ^8 x& `/ t9 I2 O
),& ]+ D' x1 l8 S4 f5 z1 P3 u$ l
})# f# U6 J. x5 [" g
( K% M' j- B, U# a
search.addWidgets([& T$ P; s# t: F+ u) q- F6 J {7 i
instantsearch.widgets.searchBox({
4 o' \3 d* Q2 u8 i8 z. k. ^+ ^
container: '#searchbox',1 m7 K. [7 }2 p- f# @' ]' K
})," R( n9 d6 }" B3 i5 y
instantsearch.widgets.hits({
# f' J1 E. X; R c7 d# b; }$ l- u4 X
container: '#hits',# _7 b# G4 j) |) U5 y' ]& ]9 P
templates: {
& N% \. A. J# U& C- W/ \
item: `+ V! L6 ?/ T) d e, I) w
<div>
, M, k/ J1 m" n! o0 k
<div class="hit-name">
* k/ K3 z( W) s
- g3 }9 `% X2 I3 L
{{#helpers.highlight}}{ "attribute": "overview" }{{/helpers.highlight}}
2 j3 w, f i9 t, ? m
({{#helpers.highlight}}{ "attribute": "id" }{{/helpers.highlight}})
e" c& U! v6 N2 p7 L6 [/ o
</div>% |: K( A+ ^, J, ^' M: O2 U
</div>1 m+ R% ~! k) y4 F* p& r
`,
/ p+ y3 H& {. p8 c f5 |1 ?/ S
},5 n6 B: @/ F$ Z( t, A
}),; d7 M6 d- u( q$ L- y' F) b1 Q
])
3 }) D+ f/ w$ J" n. T; f
6 A4 [4 V- n! j, S* y' U; X
search.start()

复制代码

搜索界面简陋一点

		自动登录	找回密码
密码			免费注册

[学习讨论] 找英文例句？ELT search肯定够了！剑桥牛津朗文麦克米伦韦氏高阶都有了~