Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commit97d82c6

Browse files
authored
feat(define-model)!: support runtime (#104)
* feat(define-model)!: support runtime* chore: add playground* chore: add changeset* docs: add* refactor: improve perf* test: update
1 parent6162a9c commit97d82c6

File tree

57 files changed

+789
-317
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

57 files changed

+789
-317
lines changed

‎.changeset/shy-maps-jog.md‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
---
2+
'@vue-macros/define-model':minor
3+
'unplugin-vue-macros':minor
4+
'@vue-macros/volar':minor
5+
'@vue-macros/common':patch
6+
---
7+
8+
add runtime defineModel, requires`@vueuse/core`.
9+
10+
⚠️ BREAKING CHANGE: original`defineModel` renamed to`$defineModel`.

‎.vscode/settings.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@
77
"Unocss",
88
"unplugin",
99
"vitest",
10-
"vmodel"
10+
"vmodel",
11+
"Vueuse"
1112
]
1213
}

‎docs/macros/define-model.md‎

Lines changed: 32 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -5,14 +5,42 @@ Declaring and mutate `v-model` props as the same as normal variable using the `d
55
| Features| Supported|
66
| :----------------:| :----------------:|
77
| Vue 3|:white_check_mark:|
8-
| Vue 2|:x:|
8+
| Vue 2|:white_check_mark:|
99
| TypeScript / Volar|:white_check_mark:|
1010

11+
##Usage
12+
13+
```vue
14+
<script setup lang="ts">
15+
const { modelValue, count } = defineModel<{
16+
modelValue: string
17+
count: number
18+
}>()
19+
20+
console.log(modelValue.value)
21+
modelValue.value = 'newValue'
22+
</script>
23+
```
24+
25+
::: warning ❌ Object declaring is not supported.
26+
27+
```vue
28+
<script setup lang="ts">
29+
const { modelValue } = defineModel({
30+
modelValue: String,
31+
})
32+
</script>
33+
```
34+
35+
:::
36+
37+
##With Reactivity Transform
38+
1139
::: warning
1240

1341
[Reactivity Transform](https://vuejs.org/guide/extras/reactivity-transform.html) is required. You should enable it first. Otherwise, it will lose the reactivity connection.
1442

15-
Unfortunately Reactivity Transform is not implemented in Vue 2, so thismacros doesn't support Vue 2 now.
43+
Unfortunately Reactivity Transform is not implemented in Vue 2, so thismacro doesn't support Vue 2 now.
1644

1745
:::
1846

@@ -22,11 +50,9 @@ Assignment expression is only supported in `<script setup>` block. In other word
2250

2351
:::
2452

25-
##Basic Usage
26-
27-
```vue
53+
```vue{7-9}
2854
<script setup lang="ts">
29-
let { modelValue, count } = defineModel<{
55+
let { modelValue, count } =$defineModel<{
3056
modelValue: string
3157
count: number
3258
}>()

‎packages/common/src/constants.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ export const DEFINE_PROPS = 'defineProps'
22
exportconstDEFINE_EMITS='defineEmits'
33
exportconstDEFINE_OPTIONS='defineOptions'
44
exportconstDEFINE_MODEL='defineModel'
5+
exportconstDEFINE_MODEL_DOLLAR='$defineModel'
56
exportconstDEFINE_SETUP_COMPONENT='defineSetupComponent'
67
exportconstDEFINE_RENDER='defineRender'
78

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,11 @@
1-
importtype{defineModelas_defineModel}from'./macros'
1+
importtype{
2+
$defineModelas_$defineModel,
3+
defineModelas_defineModel,
4+
}from'./macros'
25

36
declare global{
47
constdefineModel:typeof_defineModel
8+
const$defineModel:typeof_$defineModel
59
}
610

711
export{}

‎packages/define-model/macros.d.ts‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,6 @@
1-
exportconstdefineModel:<T>()=>T
1+
importtype{WritableComputedRef}from'vue'
2+
3+
exportconstdefineModel:<T>()=>{
4+
[KinkeyofT]:WritableComputedRef<T[K]>
5+
}
6+
exportconst$defineModel:<T>()=>T

‎packages/define-model/package.json‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -67,6 +67,14 @@
6767
"build":"tsup && tsx ../../scripts/postbuild.mts",
6868
"dev":"DEV=1 tsup"
6969
},
70+
"peerDependencies": {
71+
"@vueuse/core":"^9.0.0"
72+
},
73+
"peerDependenciesMeta": {
74+
"@vueuse/core": {
75+
"optional":true
76+
}
77+
},
7078
"dependencies": {
7179
"@rollup/pluginutils":"^4.2.1",
7280
"@vue-macros/common":"workspace:*",
Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,19 @@
1-
exportconstemitHelperId='/plugin-define-model/emit-helper'
1+
exportconsthelperPrefix='/plugin-define-model'
2+
3+
exportconstemitHelperId=`${helperPrefix}/emit-helper`
24
exportconstemitHelperCode=`export default (emitFn, key, value, ...args) => {
35
emitFn(key, value)
46
return args.length > 0 ? args[0] : value
57
}`
8+
9+
exportconstuseVmodelHelperId=`${helperPrefix}/use-vmodel`
10+
exportconstuseVmodelHelperCode=`import { getCurrentInstance } from 'vue';
11+
import { useVModel } from '@vueuse/core';
12+
export default (...keys) => {
13+
const props = getCurrentInstance().proxy.$props
14+
const ret = {}
15+
for (const [key, eventName] of keys)
16+
ret[key] = useVModel(props, key, undefined, { eventName })
17+
return ret
18+
}
19+
`

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp