LangChain Reference home pageLangChain ReferenceLangChain Reference
  • GitHub
  • Main Docs
Deep Agents
LangChain
LangGraph
Integrations
LangSmith
LangGraph
  • Web
  • Channels
  • Pregel
  • Prebuilt
  • Remote
  • Stream
  • Overview
  • Getting started
  • useStream
  • Selectors
  • Interrupts & headless tools
  • Subagents & subgraphs
  • Fork & edit from a checkpoint
  • Submission queue
  • Multimodal media
  • Transports
  • Suspense
  • provideStream & context
  • Type safety
  • Migrating to v1
LangGraph SDK
  • Client
  • Auth
  • React
  • Logging
  • React Ui
  • Server
LangGraph Checkpoint
LangGraph Checkpoint MongoDB
LangGraph Checkpoint Postgres
LangGraph Checkpoint Redis
  • Shallow
  • Store
LangGraph Checkpoint SQLite
LangGraph Checkpoint Validation
  • Cli
LangGraph API
LangGraph CLI
LangGraph CUA
  • Utils
LangGraph Supervisor
LangGraph Swarm
โŒ˜I

Chat LangChain

What can I help with?

Enter to sendยทShift+Enter new line

Menu

LangGraph
WebChannelsPregelPrebuiltRemoteStream
OverviewGetting starteduseStreamSelectorsInterrupts & headless toolsSubagents & subgraphsFork & edit from a checkpointSubmission queueMultimodal mediaTransportsSuspenseprovideStream & contextType safetyMigrating to v1
LangGraph SDK
ClientAuthReactLoggingReact UiServer
LangGraph Checkpoint
LangGraph Checkpoint MongoDB
LangGraph Checkpoint Postgres
LangGraph Checkpoint Redis
ShallowStore
LangGraph Checkpoint SQLite
LangGraph Checkpoint Validation
Cli
LangGraph API
LangGraph CLI
LangGraph CUA
Utils
LangGraph Supervisor
LangGraph Swarm
Language
Theme
JavaScript@langchain/vueuseStream
Functionโ—Since v0.1

useStream

Vue Composition API binding for the v2-native stream runtime.

Returns a handle whose projections are Vue refs so templates auto-unwrap and scripts can feed them into computed/watch. Scoped views (subagents, subgraphs, any namespaced projection) are surfaced via the companion selector composables (useMessages, useToolCalls, useValues, useMessageMetadata, useSubmissionQueue, useExtension, useChannel, plus media composables).

Copy
useStream<
  T = Record<string, unknown>,
  InterruptType = unknown,
  ConfigurableType extends object = Record

Used in Docs

  • AI Elements
  • assistant-ui
  • Branching chat
  • Build a custom frontend for a Managed Deep Agent
  • Custom stream channels
(7 more not shown)
View source on GitHub
<
string
,
unknown
>
>
(
options
:
UseStreamOptions
<
InferStateType
<
T
>
>
)
:
UseStreamReturn
<
T
,
InterruptType
,
ConfigurableType
>

Parameters

NameTypeDescription
options*UseStreamOptions<InferStateType<T>>

Example

Copy
<script setup lang="ts">
import { useStream } from "@langchain/vue";

const stream = useStream({
  assistantId: "agent",
  apiUrl: "http://localhost:2024",
});
</script>

<template>
  <div v-for="msg in stream.messages.value" :key="msg.id">
    {{ msg.content }}
  </div>
  <button @click="stream.submit({ messages: [{ type: 'human', content: 'Hi' }] })">
    Send
  </button>
</template>