File tree Expand file tree Collapse file tree 2 files changed +26
-5
lines changed Expand file tree Collapse file tree 2 files changed +26
-5
lines changed Original file line number Diff line number Diff line change 1
1
MIT License
2
2
3
- Copyright (c) 2021 Anthony Fu <https://github.com/zhiyuanzmj>
3
+ Copyright (c) 2021 zhiyuanzmj <https://github.com/zhiyuanzmj>
4
4
5
5
Permission is hereby granted, free of charge, to any person obtaining a copy
6
6
of this software and associated documentation files (the "Software"), to deal
Original file line number Diff line number Diff line change 1
1
<script lang="tsx">
2
- import { defineComponent } from ' vue'
2
+ import { defineComponent , ref } from ' vue'
3
3
4
4
const Comp = (props , { slots }) => (
5
- <>{ slots .default ? <slots.default /> : <div >default slot</div >} </>
5
+ <>
6
+ { slots .default ? (
7
+ <slots.default foo = { props .foo } />
8
+ ) : (
9
+ <div >default slot</div >
10
+ )}
11
+ </>
6
12
)
7
13
8
- let slots = { default : () => <div >foo</div > }
14
+ let slots = {
15
+ default : (scope ) => <div >{ scope .foo } </div >,
16
+ }
9
17
10
18
export default defineComponent ({
11
19
setup(props ) {
12
- return <Comp v-slots = { slots } ></Comp >
20
+ const foo = ref (' foo' )
21
+ return (
22
+ <>
23
+ <input
24
+ value = { foo .value }
25
+ onInput = { (e ) => (foo .value = e .target .value )}
26
+ />
27
+ <Comp v-slots = { slots } foo = { foo .value } />
28
+ <Comp
29
+ v-slots = { { default : ({ foo }) => <div >{ foo } </div > }}
30
+ foo = { foo .value }
31
+ />
32
+ </>
33
+ )
13
34
},
14
35
})
15
36
</script >
You can’t perform that action at this time.
0 commit comments