11---
22outline : deep
33---
4+ # Components
45
5- # API
6+ ## ` <UseMediaRecorder /> `
67
7- ## Props
8+ ### Props
89
9- ### ` constraints `
10+ #### ` constraints `
1011
1112- Type: ` MediaStreamConstraints `
1213- Required: ` true `
1314
1415The constraints parameter is a MediaStreamConstraints object specifying the types of media to request, along with any
1516requirements for each type.
1617
17- ### ` mediaRecorderOptions `
18+ #### ` mediaRecorderOptions `
1819
1920- Type: ` MediaRecorderOptions `
2021- Default: ` {} `
2122
2223Options to pass to the MediaRecorder constructor. [ See MDN] ( https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder/MediaRecorder#options )
2324
24- ## Events
25+ ### Events
2526
2627``` ts
2728defineEmits <{
@@ -35,48 +36,48 @@ defineEmits<{
3536
3637Analog to the MediaRecorder events (` onstart ` , ` onpause ` ,...).
3738
38- ### ` @start `
39+ #### ` @start `
3940
4041Emitted when the MediaRecorder starts recording.
4142
42- ### ` @pause `
43+ #### ` @pause `
4344
4445Emitted when the MediaRecorder pauses recording.
4546
46- ### ` @resume `
47+ #### ` @resume `
4748
4849Emitted when the MediaRecorder resumes recording.
4950
50- ### ` @stop `
51+ #### ` @stop `
5152
5253Emitted when the MediaRecorder stops recording.
5354
54- ### ` @error `
55+ #### ` @error `
5556
5657Emitted when an error occurs.
5758
58- ## Slots
59+ ### Slots
5960
60- ### ` default `
61+ #### ` default `
6162
6263The default slot is used to render the component's content.
6364
64- #### slopProps
65+ ##### slopProps
6566
66- ##### ` data `
67+ ###### ` data `
6768
6869- Type: ` Ref<Blob[]> `
6970- Initial value: ` ref([]) `
7071
7172An array of Blobs that are created by the MediaRecorder. The Blobs are created when the MediaRecorder is stopped. Or
7273when the timeslice is set and the timeslice is reached.
7374
74- ##### ` stream `
75+ ###### ` stream `
7576
7677- Type: ` ShallowRef<MediaStream | undefined> `
7778- Initial value: ` shallowRef() `
7879
79- ##### ` state `
80+ ###### ` state `
8081
8182- Type: ` ShallowRef<MediaRecorderState | undefined> `
8283- Initial value: ` shallowRef() `
@@ -88,7 +89,7 @@ The current state of the MediaRecorder. The state can be one of the following:
8889- ` 'recording' ` - The MediaRecorder is recording data.
8990- ` 'paused' ` - The MediaRecorder is paused.
9091
91- ##### ` mimeType `
92+ ###### ` mimeType `
9293
9394- Type: ` ComputedRef<string | undefined> `
9495- Initial value: ` computed(()=>{}) `
@@ -102,72 +103,72 @@ check if the mimeType
102103is supported via [ ` isMimeTypeSupported ` ] ( #ismimetypesupported ) .
103104:::
104105
105- ##### ` isMimeTypeSupported `
106+ ###### ` isMimeTypeSupported `
106107
107108- Type: ` ComputedRef<boolean> `
108109
109110If you set the mimeType manually, you can check if the mimeType is supported by the browser via this computed ref.
110111
111- ##### ` isSupported `
112+ ###### ` isSupported `
112113
113114- Type: ` ComputedRef<boolean> `
114115
115116If the MediaRecorder API (and the selected MIME type) is supported by the browser.
116117
117- ##### ` mediaRecorder `
118+ ###### ` mediaRecorder `
118119
119120- Type: ` ComputedRef<MediaRecorder | undefined> `
120121- Initial value: ` computed(()=>{}) `
121122
122123The MediaRecorder instance. The MediaRecorder is created when the stream is available.
123124
124- ##### ` start `
125+ ###### ` start `
125126
126127- Type: ` (timeslice: number | undefined) => Promise<void> `
127128- MDN: [ MediaRecorder.start()] ( https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder/start )
128129
129130Creates the stream and the MediaRecorder instance. The stream is created with the constraints object. The MediaRecorder
130131is created with the stream and the mediaRecorderOptions object.
131132
132- ##### ` pause `
133+ ###### ` pause `
133134
134135- Type: ` () => void `
135136- MDN: [ MediaRecorder.pause()] ( https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder/pause )
136137
137- ##### ` resume `
138+ ###### ` resume `
138139
139140- Type: ` () => void `
140141- MDN: [ MediaRecorder.resume()] ( https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder/resume )
141142
142- ##### ` stop `
143+ ###### ` stop `
143144
144145- Type: ` () => void `
145146- MDN: [ MediaRecorder.stop()] ( https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder/stop )
146147
147- ## Methods
148+ ### Methods
148149
149150` UseMediaRecorder ` does expose the following methods:
150151
151- ### ` start(timeslice: number | undefined): Promise<void> `
152+ #### ` start(timeslice: number | undefined): Promise<void> `
152153
153154- MDN: [ MediaRecorder.start()] ( https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder/start )
154155
155156Creates the stream and the MediaRecorder instance. The stream is created with the constraints object. The MediaRecorder
156157is created with the stream and the mediaRecorderOptions object.
157158
158- ### ` pause(): void `
159+ #### ` pause(): void `
159160
160161- MDN: [ MediaRecorder.pause()] ( https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder/pause )
161162
162- ### ` resume(): void `
163+ #### ` resume(): void `
163164
164165- MDN: [ MediaRecorder.resume()] ( https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder/resume )
165166
166- ### ` stop(): void `
167+ #### ` stop(): void `
167168
168169- MDN: [ MediaRecorder.stop()] ( https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder/stop )
169170
170- ### Usage
171+ #### Usage
171172
172173``` vue
173174<script setup>
0 commit comments