algolia / algolia/doc-code-samples

Cannot read property 'instantSearchInstance' of undefined

オープン
#249 コメント 11 件 リアクション 0 件 担当者 0 名 GitHub で見る
主要言語
TypeScript
スター
99
フォーク
122
PR マージ指標
30日以内にマージされた PR はありません

説明

I followed the intruction like this package project. i am using vue-instantsearch 4.0.0 for vuejs 3

I copied script like below:

```

import algoliasearch from 'algoliasearch/lite'
import { h, onMounted, Fragment, render, ref } from 'vue'
import { useRouter } from 'vue-router'
import { createElement } from '../composables/adapter'

export default {

data(){
return {
searchClient: algoliasearch(
"latency",
"6be0576ff61c053d5f9a3225e2a90f76"
),
}
},
setup(){

onMounted(() => {
})

return {

}
}

}

.container {
max-width: 1200px;
margin: 0 auto;
padding: 1rem;
}
.search-panel {
display: flex;
}
.search-panel__filters {
flex: 1;
}
.search-panel__results {
flex: 3;
}
.searchbox {
margin-bottom: 2rem;
}
.pagination {
margin: 2rem auto;
text-align: center;
}

```
But the result is error in console.

> Uncaught (in promise) TypeError: Cannot read property 'instantSearchInstance' of undefined
> at Proxy.eval (widget.js?c00b:1)
> at Proxy.created (widget.js?c00b:1)
> at callWithErrorHandling (runtime-core.esm-bundler.js?5c40:154)
> at callWithAsyncErrorHandling (runtime-core.esm-bundler.js?5c40:163)
> at callHookFromMixins (runtime-core.esm-bundler.js?5c40:5914)
> at callSyncHook (runtime-core.esm-bundler.js?5c40:5890)
> at applyOptions (runtime-core.esm-bundler.js?5c40:5825)
> at finishComponentSetup (runtime-core.esm-bundler.js?5c40:6503)
> at setupStatefulComponent (runtime-core.esm-bundler.js?5c40:6436)
> at setupComponent (runtime-core.esm-bundler.js?5c40:6376)
> eval @ widget.js?c00b:1
> created @ widget.js?c00b:1

Btw, i have same settings in main.js
```
import InstantSearch from 'vue-instantsearch/vue3/es'
import { projectAuth } from './firebase/config'

let app

projectAuth.onAuthStateChanged(() => {
if(!app){
app = createApp(App)
.use(router)
.use(store)
.use(Notifications)
.use(InstantSearch)
.mount('#app')
}
})
```

コントリビューションガイド

このリポジトリのコントリビューションガイドは索引されていません

調査の方向性

issue に示されているコンポーネントから始め、その Vue InstantSearch の使用方法を main.js のプラグイン登録と比較します。vue-instantsearch 4.0.0 を使用して Vue 3 のエラーを再現し、報告された instantSearchInstance へのアクセスを追跡します。提供された例が、報告されたコンソールエラーなしでマウントできれば完了です。

索引モデルが issue の本文から書いたものです。

評価

技術スタック
javascript
領域
frontend
issue の種類
バグ
難易度
3/5
見積もり時間
1〜2日
活発さ
停滞
明瞭さ
おおむね明確
初心者へのやさしさ
32/100

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。