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

Commitc91cb0f

Browse files
committed
feat: introduce definePropsRefs
1 parent33849ad commitc91cb0f

File tree

35 files changed

+450
-2
lines changed

35 files changed

+450
-2
lines changed

‎.changeset/many-crabs-compete.md‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
---
2+
'@vue-macros/common':major
3+
'@vue-macros/nuxt':major
4+
'@vue-macros/define-props-refs':minor
5+
'unplugin-vue-macros':minor
6+
'@vue-macros/volar':minor
7+
'@vue-macros/define-props':patch
8+
---
9+
10+
introduce`definePropsRefs`

‎docs/.vitepress/configs/navs.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,10 @@ export const sidebar: DefaultTheme.Sidebar = [
4747
text:'defineProps',
4848
link:'/macros/define-props',
4949
},
50+
{
51+
text:'definePropsRefs',
52+
link:'/macros/define-props-refs',
53+
},
5054
{
5155
text:'defineSlots',
5256
link:'/macros/define-slots',

‎docs/guide/bundler-integration.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -137,6 +137,7 @@ npm i -D @vue-macros/volar
137137
"plugins": [
138138
"@vue-macros/volar/define-model",
139139
"@vue-macros/volar/define-props",
140+
"@vue-macros/volar/define-props-refs",
140141
"@vue-macros/volar/short-vmodel",
141142
"@vue-macros/volar/define-slots",
142143
"@vue-macros/volar/export-props"

‎docs/macros/define-props-refs.md‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
#definePropsRefs
2+
3+
<small>Stability: <codeclass="!text-yellow-600">unstable</code></small>
4+
5+
Returns refs from`defineProps` instead of a reactive object. It can be destructured without losing reactivity.
6+
7+
`toRefs(defineProps())` =>`definePropsRefs()`
8+
9+
| Features| Supported|
10+
| :-----------------------:| :----------------:|
11+
| Vue 3|:white_check_mark:|
12+
| Nuxt 3|:white_check_mark:|
13+
| Vue 2|:white_check_mark:|
14+
| TypeScript / Volar Plugin|:white_check_mark:|
15+
16+
##Basic Usage
17+
18+
```vue {2-3,8}
19+
<script setup lang="ts">
20+
// ✅ won't lose reactivity with destructuring
21+
const { foo, bar } = definePropsRefs<{
22+
foo: string
23+
bar: number
24+
}>()
25+
// ⬇️ Ref<string>
26+
console.log(foo.value, bar.value)
27+
</script>
28+
```
29+
30+
##Volar Configuration
31+
32+
```jsonc {6}
33+
// tsconfig.json
34+
{
35+
"vueCompilerOptions": {
36+
"target":3,
37+
"plugins": [
38+
"@vue-macros/volar/define-props-refs"
39+
// ...more feature
40+
]
41+
}
42+
}
43+
```

‎docs/macros/define-props.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ Unfortunately Reactivity Transform is not implemented in Vue 2, so this macro do
2424
##Basic Usage
2525

2626
```vue
27-
<script setup lang="tsx">
27+
<script setup lang="ts">
2828
// ⬇️ ReactiveVariable<string[]>
2929
const { foo } = $defineProps<{
3030
foo: string[]

‎packages/common/src/constants.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
exportconstDEFINE_PROPS='defineProps'
22
exportconstDEFINE_PROPS_DOLLAR='$defineProps'
3+
exportconstDEFINE_PROPS_REFS='definePropsRefs'
34
exportconstDEFINE_EMITS='defineEmits'
45
exportconstWITH_DEFAULTS='withDefaults'
56
exportconstDEFINE_OPTIONS='defineOptions'
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
#@vue-macros/define-props-refs[![npm](https://img.shields.io/npm/v/@vue-macros/define-props-refs.svg)](https://npmjs.com/package/@vue-macros/define-props-refs)
2+
3+
Please refer to[README.md](https://github.com/sxzz/unplugin-vue-macros#readme)
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
importtype{definePropsRefsas_definePropsRefs}from'./macros'
2+
3+
declare global{
4+
constdefinePropsRefs:typeof_definePropsRefs
5+
}
Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
importtype{
2+
ComponentObjectPropsOptions,
3+
DeepReadonly,
4+
ExtractPropTypes,
5+
Ref,
6+
ToRefs,
7+
}from'vue'
8+
9+
exportdeclarefunctiondefinePropsRefs<PropNamesextendsstring=string>(
10+
props:PropNames[]
11+
):DeepReadonly<{
12+
[keyinPropNames]:Readonly<Ref<any>>
13+
}>
14+
exportdeclarefunctiondefinePropsRefs<
15+
PPextendsComponentObjectPropsOptions=ComponentObjectPropsOptions
16+
>(props:PP):DeepReadonly<Required<ToRefs<ExtractPropTypes<PP>>>>
17+
18+
exportdeclarefunctiondefinePropsRefs<TypeProps>():DeepReadonly<
19+
Required<ToRefs<TypeProps>>
20+
>
Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
{
2+
"name":"@vue-macros/define-props-refs",
3+
"version":"0.0.0",
4+
"packageManager":"pnpm@7.26.0",
5+
"description":"",
6+
"keywords": [
7+
"unplugin",
8+
"vue",
9+
"sfc",
10+
"setup",
11+
"macros",
12+
"script-setup",
13+
"define-props-refs"
14+
],
15+
"license":"MIT",
16+
"homepage":"https://github.com/sxzz/unplugin-vue-macros#readme",
17+
"bugs": {
18+
"url":"https://github.com/sxzz/unplugin-vue-macros/issues"
19+
},
20+
"repository": {
21+
"type":"git",
22+
"url":"git+https://github.com/sxzz/unplugin-vue-macros.git"
23+
},
24+
"author":"三咲智子 <sxzz@sxzz.moe>",
25+
"files": [
26+
"dist",
27+
"*.d.ts"
28+
],
29+
"main":"dist/index.js",
30+
"module":"dist/index.mjs",
31+
"types":"dist/index.d.ts",
32+
"exports": {
33+
".": {
34+
"types":"./dist/index.d.ts",
35+
"require":"./dist/index.js",
36+
"import":"./dist/index.mjs"
37+
},
38+
"./vite": {
39+
"types":"./dist/vite.d.ts",
40+
"require":"./dist/vite.js",
41+
"import":"./dist/vite.mjs"
42+
},
43+
"./webpack": {
44+
"types":"./dist/webpack.d.ts",
45+
"require":"./dist/webpack.js",
46+
"import":"./dist/webpack.mjs"
47+
},
48+
"./rollup": {
49+
"types":"./dist/rollup.d.ts",
50+
"require":"./dist/rollup.js",
51+
"import":"./dist/rollup.mjs"
52+
},
53+
"./esbuild": {
54+
"types":"./dist/esbuild.d.ts",
55+
"require":"./dist/esbuild.js",
56+
"import":"./dist/esbuild.mjs"
57+
},
58+
"./macros":"./macros.d.ts",
59+
"./macros-global":"./macros-global.d.ts",
60+
"./*":"./*"
61+
},
62+
"scripts": {
63+
"build":"tsup && tsx ../../scripts/postbuild.mts",
64+
"dev":"DEV=1 tsup"
65+
},
66+
"peerDependencies": {
67+
"vue":"^2.7.0 || ^3.2.25"
68+
},
69+
"dependencies": {
70+
"@rollup/pluginutils":"^5.0.2",
71+
"@vue-macros/common":"workspace:~",
72+
"unplugin":"^1.0.1"
73+
},
74+
"devDependencies": {
75+
"vue":"^3.2.45"
76+
},
77+
"engines": {
78+
"node":">=14.19.0"
79+
}
80+
}

0 commit comments

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