File tree Expand file tree Collapse file tree 2 files changed +40
-10
lines changed
packages/babel-plugin-jsx Expand file tree Collapse file tree 2 files changed +40
-10
lines changed Original file line number Diff line number Diff line change @@ -134,7 +134,7 @@ const App = () => <input type="email" placeholder={placeholderText} />;
134
134
135
135
### 指令
136
136
137
- v-show
137
+ #### v-show
138
138
139
139
```jsx
140
140
const App = {
@@ -147,14 +147,18 @@ const App = {
147
147
};
148
148
```
149
149
150
- v-model
150
+ #### v-model
151
151
152
152
> 注意:如果想要使用 `arg`, 第二个参数需要为字符串
153
153
154
154
```jsx
155
155
<input v-model={val} />
156
156
```
157
157
158
+ ```jsx
159
+ <input v-model:argument={val} />
160
+ ```
161
+
158
162
```jsx
159
163
<input v-model={[val, ["modifier"]]} />
160
164
```
@@ -175,7 +179,7 @@ h(A, {
175
179
});
176
180
```
177
181
178
- v-models
182
+ #### v-models (从 1.1.0 开始不推荐使用)
179
183
180
184
> 注意: 你应该传递一个二维数组给 v-models。
181
185
@@ -220,6 +224,17 @@ h(A, {
220
224
221
225
自定义指令
222
226
227
+ 只有 argument 的时候推荐使用
228
+
229
+ ```jsx
230
+ const App = {
231
+ directives: { custom: customDirective },
232
+ setup() {
233
+ return () => <a v-custom:arg={val} />;
234
+ },
235
+ };
236
+ ```
237
+
223
238
```jsx
224
239
const App = {
225
240
directives: { custom: customDirective },
@@ -284,7 +299,7 @@ const App = {
284
299
};
285
300
```
286
301
287
- ### 在 TypeSript 中使用
302
+ ### 在 TypeScript 中使用
288
303
289
304
`tsconfig.json`:
290
305
Original file line number Diff line number Diff line change @@ -14,9 +14,9 @@ Install the plugin with:
14
14
npm install @vue/babel-plugin-jsx -D
15
15
```
16
16
17
- Then add the plugin to .babelrc :
17
+ Then add the plugin to your babel config :
18
18
19
- ``` js
19
+ ``` json
20
20
{
21
21
"plugins" : [" @vue/babel-plugin-jsx" ]
22
22
}
@@ -138,7 +138,7 @@ const App = () => <input type="email" placeholder={placeholderText} />;
138
138
139
139
### Directives
140
140
141
- v-show
141
+ #### v-show
142
142
143
143
```jsx
144
144
const App = {
@@ -151,14 +151,18 @@ const App = {
151
151
};
152
152
```
153
153
154
- v-model
154
+ #### v-model
155
155
156
156
> Note: You should pass the second param as string for using `arg`.
157
157
158
158
```jsx
159
159
<input v-model={val} />
160
160
```
161
161
162
+ ```jsx
163
+ <input v-model:argument={val} />
164
+ ```
165
+
162
166
```jsx
163
167
<input v-model={[val, ["modifier"]]} />
164
168
```
@@ -179,7 +183,7 @@ h(A, {
179
183
});
180
184
```
181
185
182
- v-models
186
+ #### v-models (Not recommended since v1.1.0)
183
187
184
188
> Note: You should pass a Two-dimensional Arrays to v-models.
185
189
@@ -222,7 +226,18 @@ h(A, {
222
226
});
223
227
```
224
228
225
- custom directive
229
+ #### custom directive
230
+
231
+ Recommended when using string arguments
232
+
233
+ ```jsx
234
+ const App = {
235
+ directives: { custom: customDirective },
236
+ setup() {
237
+ return () => <a v-custom:arg={val} />;
238
+ },
239
+ };
240
+ ```
226
241
227
242
```jsx
228
243
const App = {
You can’t perform that action at this time.
0 commit comments