useBrowserLocation
Reactive browser location
NOTE: If you're using Vue Router, use
useRoute
provided by Vue Router instead.
Demo
trigger: 'load'
Usage
js
import { useBrowserLocation } from '@vueuse/core'
const location = useBrowserLocation()
import { useBrowserLocation } from '@vueuse/core'
const location = useBrowserLocation()
Component Usage
This function also provides a renderless component version via the
@vueuse/components
package. Learn more about the usage.
html
<UseBrowserLocation v-slot="{ location }">
Browser Location: {{ location }}
</UseBrowserLocation>
<UseBrowserLocation v-slot="{ location }">
Browser Location: {{ location }}
</UseBrowserLocation>
Type Declarations
typescript
export interface BrowserLocationState {
trigger: string
state?: any
length?: number
hash?: string
host?: string
hostname?: string
href?: string
origin?: string
pathname?: string
port?: string
protocol?: string
search?: string
}
/**
* Reactive browser location.
*
* @see https://vueuse.org/useBrowserLocation
* @param options
*/
export declare function useBrowserLocation({
window,
}?: ConfigurableWindow): Ref<{
trigger: string
state?: any
length?: number | undefined
hash?: string | undefined
host?: string | undefined
hostname?: string | undefined
href?: string | undefined
origin?: string | undefined
pathname?: string | undefined
port?: string | undefined
protocol?: string | undefined
search?: string | undefined
}>
export type UseBrowserLocationReturn = ReturnType<typeof useBrowserLocation>
export interface BrowserLocationState {
trigger: string
state?: any
length?: number
hash?: string
host?: string
hostname?: string
href?: string
origin?: string
pathname?: string
port?: string
protocol?: string
search?: string
}
/**
* Reactive browser location.
*
* @see https://vueuse.org/useBrowserLocation
* @param options
*/
export declare function useBrowserLocation({
window,
}?: ConfigurableWindow): Ref<{
trigger: string
state?: any
length?: number | undefined
hash?: string | undefined
host?: string | undefined
hostname?: string | undefined
href?: string | undefined
origin?: string | undefined
pathname?: string | undefined
port?: string | undefined
protocol?: string | undefined
search?: string | undefined
}>
export type UseBrowserLocationReturn = ReturnType<typeof useBrowserLocation>
Source
Contributors
Anthony Fu
vaakian X
Mike
Eureka
Shinigami
wheat
Alex Kozack
Antério Vieira