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

Commit6193a84

Browse files
zhiyuanzmjsxzz
andauthored
feat: introduceshortBind (#493)
Co-authored-by: 三咲智子 Kevin Deng <sxzz@sxzz.moe>
1 parentc1351c9 commit6193a84

File tree

39 files changed

+1026
-8
lines changed

39 files changed

+1026
-8
lines changed

‎.changeset/smart-toys-pay.md‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
---
2+
'@vue-macros/short-bind':minor
3+
'@vue-macros/volar':minor
4+
'@vue-macros/eslint-config':minor
5+
'unplugin-vue-macros':minor
6+
'@vue-macros/nuxt':minor
7+
---
8+
9+
Introduce`shortBind`

‎docs/.vitepress/locales/common.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -133,6 +133,10 @@ export const sidebar = (lang: string): DefaultTheme.SidebarItem[] => {
133133
text:'chainCall',
134134
link:`${urlPrefix}/macros/chain-call`,
135135
},
136+
{
137+
text:'shortBind',
138+
link:`${urlPrefix}/macros/short-bind`,
139+
},
136140
],
137141
},
138142
],

‎docs/macros/short-bind.md‎

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
#shortBind
2+
3+
<StabilityLevellevel="experimental" />
4+
5+
A shorthand for binding prop with the same data name.
6+
7+
`:value` ->`:value="value"`
8+
9+
If you have any questions about this feature, you can comment on[RFC Discussion](https://github.com/vuejs/rfcs/discussions/405).
10+
11+
| Features| Supported|
12+
| :----------:| :----------------:|
13+
| Vue 3|:white_check_mark:|
14+
| Nuxt 3|:white_check_mark:|
15+
| Vue 2|:x:|
16+
| Volar Plugin|:white_check_mark:|
17+
18+
##Usage
19+
20+
###Basic Usage
21+
22+
```vue
23+
<template>
24+
<input :msg />
25+
<!-- => <input :msg="msg" /> -->
26+
<demo $msg />
27+
<!-- => <input $msg="msg" /> -->
28+
</template>
29+
```
30+
31+
###With`shortVmodel`
32+
33+
```vue
34+
<template>
35+
<input ::msg />
36+
<!-- => <input ::msg="msg" /> => <input v-model:msg="msg" /> -->
37+
<demo $msg />
38+
<!-- => <input $msg="msg" /> => <input v-model:msg="msg" /> -->
39+
<demo *msg />
40+
<!-- => <input *msg="msg" /> => <input v-model:msg="msg" /> -->
41+
</template>
42+
```
43+
44+
##Volar Configuration
45+
46+
```jsonc {5}
47+
// tsconfig.json
48+
{
49+
"vueCompilerOptions": {
50+
"plugins": [
51+
"@vue-macros/volar/short-bind"
52+
// ...
53+
]
54+
}
55+
}
56+
```
57+
58+
##ESLint Configuration
59+
60+
```jsonc {4}
61+
// .eslintrc
62+
{
63+
"rules": {
64+
"vue/valid-v-bind":"off"
65+
}
66+
}
67+
```

‎docs/zh-CN/macros/short-bind.md‎

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
#shortBind
2+
3+
<StabilityLevellevel="experimental" />
4+
5+
绑定相同数据名称的`prop` 的语法糖。
6+
7+
`:value` ->`:value="value"`
8+
9+
如果你对此功能有任何疑问，欢迎在[RFC](https://github.com/vuejs/rfcs/discussions/405) 中发表评论。
10+
11+
| Features| Supported|
12+
| :----------:| :----------------:|
13+
| Vue 3|:white_check_mark:|
14+
| Nuxt 3|:white_check_mark:|
15+
| Vue 2|:x:|
16+
| Volar Plugin|:white_check_mark:|
17+
18+
##用法
19+
20+
###基本用法
21+
22+
```vue
23+
<template>
24+
<input :msg />
25+
<!-- => <input :msg="msg" /> -->
26+
<demo $msg />
27+
<!-- => <input $msg="msg" /> -->
28+
</template>
29+
```
30+
31+
###和`shortVmodel` 一起使用
32+
33+
```vue
34+
<template>
35+
<input ::msg />
36+
<!-- => <input ::msg="msg" /> => <input v-model:msg="msg" /> -->
37+
<demo $msg />
38+
<!-- => <input $msg="msg" /> => <input v-model:msg="msg" /> -->
39+
<demo *msg />
40+
<!-- => <input *msg="msg" /> => <input v-model:msg="msg" /> -->
41+
</template>
42+
```
43+
44+
##Volar 配置
45+
46+
```jsonc {5}
47+
// tsconfig.json
48+
{
49+
"vueCompilerOptions": {
50+
"plugins": [
51+
"@vue-macros/volar/short-bind"
52+
// ...
53+
]
54+
}
55+
}
56+
```
57+
58+
##ESLint 配置
59+
60+
```jsonc {4}
61+
// .eslintrc
62+
{
63+
"rules": {
64+
"vue/valid-v-bind":"off"
65+
}
66+
}
67+
```

‎eslint.config.js‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ export default sxzz([
1717
files:['**/*.md/*.{js,ts,vue}'],
1818
rules:{
1919
'no-var':'off',
20+
'vue/valid-v-bind':'off',
2021
'import/no-mutable-exports':'off',
2122
'@typescript-eslint/no-inferrable-types':'off',
2223
'@typescript-eslint/no-empty-function':'off',
@@ -27,6 +28,7 @@ export default sxzz([
2728
rules:{
2829
'no-debugger':'off',
2930
'no-console':'off',
31+
'vue/valid-v-bind':'off',
3032
'vue/require-prop-types':'off',
3133
'vue/valid-define-props':'off',
3234
'vue/valid-attribute-name':'off',

‎packages/eslint-config/index.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ const config = {
2424
},
2525
rules:{
2626
'vue/no-setup-props-destructure':'off',
27+
'vue/valid-v-bind':'off',
2728
},
2829
}
2930

‎packages/macros/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -100,6 +100,7 @@
100100
"@vue-macros/setup-block":"workspace:*",
101101
"@vue-macros/setup-component":"workspace:*",
102102
"@vue-macros/setup-sfc":"workspace:*",
103+
"@vue-macros/short-bind":"workspace:*",
103104
"@vue-macros/short-emits":"workspace:*",
104105
"@vue-macros/short-vmodel":"workspace:*",
105106
"unplugin":"^1.5.0",

‎packages/macros/src/index.ts‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -72,6 +72,9 @@ import VueSetupComponent, {
7272
importVueSetupSFC,{
7373
typeOptionsasOptionsSetupSFC,
7474
}from'@vue-macros/setup-sfc'
75+
importVueShortBind,{
76+
typeOptionsasOptionsShortBind,
77+
}from'@vue-macros/short-bind'
7578
importVueShortEmits,{
7679
typeOptionsasOptionsShortEmits,
7780
}from'@vue-macros/short-emits'
@@ -104,6 +107,7 @@ export interface FeatureOptionsMap {
104107
setupBlock:OptionsSetupBlock
105108
setupComponent:OptionsSetupComponent
106109
setupSFC:OptionsSetupSFC
110+
shortBind:OptionsShortBind
107111
shortEmits:OptionsShortEmits
108112
shortVmodel:OptionsShortVmodel
109113
}
@@ -162,6 +166,7 @@ export function resolveOptions({
162166
setupBlock,
163167
setupComponent,
164168
setupSFC,
169+
shortBind,
165170
shortEmits,
166171
shortVmodel,
167172
}:Options):OptionsResolved{
@@ -254,6 +259,7 @@ export function resolveOptions({
254259
root,
255260
}),
256261
setupSFC:resolveSubOptions<'setupSFC'>(setupSFC,{ version},false),
262+
shortBind:resolveSubOptions<'shortBind'>(shortBind,{ version},false),
257263
shortEmits:resolveSubOptions<'shortEmits'>(
258264
shortEmits,
259265
{ version},
@@ -346,6 +352,12 @@ export default createCombinePlugin<Options | undefined>(
346352
framework,
347353
options.booleanProp
348354
),
355+
resolvePlugin(
356+
// VueShortBind is not an unplugin, by now
357+
VueShortBindasany,
358+
framework,
359+
options.shortBind
360+
),
349361
resolvePlugin(
350362
// VueShortVmodel is not an unplugin, by now
351363
VueShortVmodelasany,

‎packages/nuxt/src/index.ts‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -96,6 +96,9 @@ export default defineNuxtModule<VueMacrosOptions>({
9696
vueCompilerOptions.experimentalDefinePropProposal=
9797
resolvedOptions.defineProp.edition||'kevinEdition'
9898

99+
if(resolvedOptions.shortBind)
100+
volarPlugins.push('@vue-macros/volar/short-bind')
101+
99102
if(resolvedOptions.shortVmodel){
100103
volarPlugins.push('@vue-macros/volar/short-vmodel')
101104
volarOptions.shortVmodel={

‎packages/short-bind/README.md‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
#@vue-macros/short-bind[![npm](https://img.shields.io/npm/v/@vue-macros/short-bind.svg)](https://npmjs.com/package/@vue-macros/short-bind)
2+
3+
Please refer to[README.md](https://github.com/vue-macros/vue-macros#readme)

0 commit comments

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