@@ -38,7 +38,6 @@ const app = Vue.createApp(
38
38
)
39
39
```
40
40
41
-
42
41
``` html
43
42
<div id =" app" >
44
43
<!-- Will display 'Evan' -->
@@ -75,11 +74,11 @@ Accepts three arguments: `type`, `props` and `children`
75
74
76
75
#### type
77
76
78
- - **Type:** ` String | Object | Function | null `
77
+ - **Type:** ` String | Object | Function `
79
78
80
79
- **Details:**
81
80
82
- An HTML tag name, a component, an async component or null . Using null would render a comment. This parameter is required
81
+ An HTML tag name, a component or an async component. Using function returning null would render a comment. This parameter is required
83
82
84
83
#### props
85
84
@@ -330,7 +329,7 @@ Accepts two arguments: `vnode` and `directives`.
330
329
331
330
- ** Type:** ` vnode `
332
331
333
- - ** Details:**
332
+ - ** Details:**
334
333
335
334
A virtual node, usually created with ` h() ` .
336
335
@@ -340,61 +339,54 @@ Accepts two arguments: `vnode` and `directives`.
340
339
341
340
- ** Details:**
342
341
343
- An array of directives.
344
-
342
+ An array of directives.
343
+
345
344
Each directive itself is an array, which allows for up to 4 indexes to be defined as seen in the following examples.
346
345
347
346
- ` [directive] ` - The directive by itself. Required.
348
347
349
348
``` js
350
349
const MyDirective = resolveDirective (' MyDirective' )
351
- const nodeWithDirectives = withDirectives (
352
- h (' div' ),
353
- [ [MyDirective] ]
354
- )
350
+ const nodeWithDirectives = withDirectives (h (' div' ), [[MyDirective]])
355
351
```
356
352
357
353
- ` [directive, value] ` - The above, plus a value of type ` any ` to be assigned to the directive
358
354
359
355
``` js
360
356
const MyDirective = resolveDirective (' MyDirective' )
361
- const nodeWithDirectives = withDirectives (
362
- h (' div' ),
363
- [ [MyDirective, 100 ] ]
364
- )
357
+ const nodeWithDirectives = withDirectives (h (' div' ), [[MyDirective, 100 ]])
365
358
```
366
359
367
360
- ` [directive, value, arg] ` - The above, plus a ` String ` argument, ie. ` click ` in ` v-on:click `
368
361
369
362
``` js
370
363
const MyDirective = resolveDirective (' MyDirective' )
371
- const nodeWithDirectives = withDirectives (
372
- h (' div' ),
373
- [ [MyDirective, 100 , ' click' ] ]
374
- )
364
+ const nodeWithDirectives = withDirectives (h (' div' ), [
365
+ [MyDirective, 100 , ' click' ]
366
+ ])
375
367
```
376
368
377
- - ` [directive, value, arg, modifiers] ` - The above, plus a ` key: value ` pair ` Object ` defining any modifiers.
369
+ - ` [directive, value, arg, modifiers] ` - The above, plus a ` key: value ` pair ` Object ` defining any modifiers.
378
370
379
371
``` js
380
372
const MyDirective = resolveDirective (' MyDirective' )
381
- const nodeWithDirectives = withDirectives (
382
- h (' div' ),
383
- [ [MyDirective, 100 , ' click' , { prevent: true }] ]
384
- )
373
+ const nodeWithDirectives = withDirectives (h (' div' ), [
374
+ [MyDirective, 100 , ' click' , { prevent: true }]
375
+ ])
385
376
```
386
377
387
378
## createRenderer
388
379
389
380
The createRenderer function accepts two generic arguments:
390
381
` HostNode ` and ` HostElement ` , corresponding to Node and Element types in the
391
- host environment.
392
-
382
+ host environment.
383
+
393
384
For example, for runtime-dom, HostNode would be the DOM
394
385
` Node ` interface and HostElement would be the DOM ` Element ` interface.
395
-
386
+
396
387
Custom renderers can pass in the platform specific types like this:
397
- ``` js
388
+
389
+ ``` js
398
390
import { createRenderer } from ' vue'
399
391
const { render , createApp } = createRenderer< Node , Element > ({
400
392
patchProp,
0 commit comments