algolia / algolia/doc-code-samples
Cannot read property 'instantSearchInstance' of undefined
- Lenguaje dominante
- TypeScript
- Estrellas
- 99
- Forks
- 122
- Métricas de merge de PR
- Sin PR fusionados en 30 d
Descripción
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')
}
})
```
Guía de contribución
No hay ninguna guía de contribución indexada para este repositorio
Línea de trabajo
Comienza con el componente mostrado en el issue y compara su uso de Vue InstantSearch con el registro del plugin en main.js. Reproduce el error de Vue 3 usando vue-instantsearch 4.0.0 y luego rastrea el acceso reportado a instantSearchInstance. Se considera completado cuando el ejemplo proporcionado se monta sin el error de consola reportado.
Escrito por el modelo de indexación a partir del texto del issue.
Evaluación
- Stack tecnológico
- javascript
- Área
- frontend
- Tipo de issue
- Error
- Dificultad
- 3/5
- Tiempo estimado
- 1-2 días
- Estado de actividad
- Estancado
- Claridad
- Bastante claro
- Aptitud para principiantes
- 32/100