react native spotlight search
v2.2.0
Modul React Native untuk iOS yang menyediakan fungsionalitas pencarian Spotlight. Hal ini memungkinkan Anda mengindeks konten dari dalam aplikasi React Native Anda sehingga muncul di indeks pencarian Spotlight perangkat iOS, sehingga berpotensi meningkatkan eksposur aplikasi Anda.
Dengan benang (disarankan): $ yarn add react-native-spotlight-search
Atau dengan NPM: $ npm install react-native-spotlight-search --save
Paket ini tidak dapat digunakan di aplikasi "Expo Go" karena memerlukan kode asli khusus.
Setelah menginstal paket npm ini, tambahkan plugin config ke array plugins app.json atau app.config.js Anda:
{
"expo" : {
"plugins" : [ " react-native-spotlight-search " ]
}
}Berikutnya, buat ulang aplikasi Anda seperti yang dijelaskan dalam panduan "Menambahkan kode asli khusus".
Penautan otomatis atau Manual di bawah
react-native link react-native-spotlight-search atau Secara manual di bawah
Cukup tambahkan RCTSpotlightSearch.xcodeproj ke Libraries dan tambahkan libRCTSpotlightSearch.a ke Link Binary With Libraries di bawah Build Phases . Info lebih lanjut dan tangkapan layar tentang cara melakukan ini tersedia di dokumentasi React Native.
Jika Anda ingin dapat menangani panggilan balik item pencarian yang disadap, Anda harus menambahkan kode berikut ke file AppDelegate Anda:
# import " RCTSpotlightSearch.h "
- ( BOOL )application:(UIApplication *)application continueUserActivity:(nonnull NSUserActivity *)userActivity restorationHandler:(nonnull void (^)( NSArray * _Nullable))restorationHandler {
[RCTSpotlightSearch handleContinueUserActivity: userActivity];
return YES ;
}Jika Xcode mengeluh karena tidak dapat menemukan file header, pastikan pencarian header proyek Anda mencakup hal berikut:
$(SRCROOT)/../node_modules/react-native-spotlight-search
Seperti ini:
Pertama, impor modul:
import SpotlightSearch from "react-native-spotlight-search" ;Anda dapat menambahkan serangkaian item:
SpotlightSearch . indexItems ( [
{
title : "Strawberry" ,
contentDescription : "A sweet and juicy fruit." ,
uniqueIdentifier : "1" ,
domain : "fruit" ,
thumbnailName : "strawberry" ,
} ,
{
title : "Kiwi" ,
contentDescription : "Not a type of bird." ,
uniqueIdentifier : "2" ,
domain : "fruit" ,
thumbnailName : "kiwi" ,
} ,
] ) ;Atau item individual:
SpotlightSearch . indexItem ( {
title : "Strawberry" ,
contentDescription : "A sweet and juicy fruit." ,
uniqueIdentifier : "1" ,
thumbnailName : "strawberry" ,
} ) ; | Milik | Keterangan | Jenis | Diperlukan |
|---|---|---|---|
title | Judul item pencarian. | string | Ya |
contentDescription | Deskripsi yang muncul di bawah judul pada hasil pencarian. | string | TIDAK |
uniqueIdentifier | Pengidentifikasi unik dan stabil. Digunakan untuk merujuk pada item. | string | Ya |
domain | String untuk mengelompokkan item terkait dengan cara yang masuk akal. Tidak ditampilkan kepada pengguna. | string | Ya |
thumbnailName | Nama file lokal/kunci untuk gambar mini. Lihat Catatan Tentang Gambar Kecil. | string | TIDAK |
thumbnailData | Representasi string base64 dari gambar mini. Lihat Catatan Tentang Gambar Kecil. | string | TIDAK |
keywords | Serangkaian kata kunci yang dapat digunakan untuk membantu menginformasikan indeks pencarian. Tidak terlihat oleh pengguna. | [string] | TIDAK |
Cukup gunakan metode yang sama seperti menambahkan item. Pastikan untuk mereferensikan kunci yang sama saat mengindeks item sehingga setiap perubahan metadata baru akan tercermin dalam indeks Spotlight.
Item dapat dihapus dengan pengidentifikasi:
SpotlightSearch . deleteItemsWithIdentifiers ( [ "1" , "2" ] ) ;Atau berdasarkan domain:
SpotlightSearch . deleteItemsInDomains ( [ "fruit" ] ) ;Alternatifnya, Anda dapat menghapus semua item yang diindeks oleh aplikasi Anda:
SpotlightSearch . deleteAllItems ( ) ;Semua metode pengindeksan dan penghapusan API tidak sinkron dan mengembalikan janji. Anda dapat merangkai hal-hal seperti ini:
SpotlightSearch . deleteAllItems ( ) . then ( ( ) => {
SpotlightSearch . indexItem ( {
title : "Strawberry" ,
contentDescription : "A sweet and juicy fruit." ,
uniqueIdentifier : "1" ,
thumbnailName : "strawberry" ,
} ) ;
} ) ;Anda dapat memilih untuk menambahkan pengendali khusus yang akan dipanggil jika pengguna mengetuk salah satu item pencarian di hasil Spotlight:
SpotlightSearch . searchItemTapped ( ( uniqueIdentifier ) => {
alert ( `You tapped on ${ uniqueIdentifier } !` ) ;
} ) ;Opsional, jika Anda ingin mengambil item penelusuran yang diketuk untuk membuka aplikasi (mungkin pendengar disetel setelah peristiwa dipicu):
SpotlightSearch . getInitialSearchItem ( ) . then ( ( uniqueIdentifier ) => {
alert ( `You tapped on ${ uniqueIdentifier } and opened the app!` ) ;
} ) ;
// example in a useEffect with listener cleanup
useEffect ( ( ) => {
const spotlightListener = SpotlightSearch . searchItemTapped ( ( uniqueIdentifier ) => {
alert ( `You tapped on ${ uniqueIdentifier } and opened the app!` ) ;
} )
return ( ) => {
// cleanup listener
spotlightListener . remove ( )
}
} , [ ] ) Parameternya akan menjadi uniqueIdentifier yang digunakan untuk mengindeks item tersebut. Anda dapat menggunakan ini untuk mencari item dan menampilkan informasi tentangnya, misalnya dengan menavigasi ke halaman yang relevan di aplikasi Anda.
Saat ini, untuk menggunakan jalur gambar, jalur tersebut harus ada secara lokal di perangkat dalam folder aset proyek. Ini adalah keterbatasan iOS dan bukan perpustakaan ini.
Untuk menggunakan gambar yang tidak ada dalam folder aset Anda (file lokal atau jarak jauh), baca gambar tersebut sebagai base64 dan sertakan nilai string menggunakan properti thumbnailData .
Selamat datang PR ❤️
