[Doc] add props name style guide (#366)

This commit is contained in:
neverland 2017-11-30 19:05:54 +08:00 committed by GitHub
parent dd25e2c184
commit 78789c6d21
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 24 additions and 0 deletions

View File

@ -58,3 +58,15 @@ Vue.use(Vant);
<!-- import script --> <!-- import script -->
<script src="https://unpkg.com/vant/lib/vant.min.js"></script> <script src="https://unpkg.com/vant/lib/vant.min.js"></script>
``` ```
### Props Named Style
HTML attributes are case-insensitive, so when using non-string templates, camelCased prop names need to use their kebab-case (hyphen-delimited) equivalents.
``` html
<!-- camelCase in JavaScript -->
<van-cell isLink />
<!-- kebab-case in HTML -->
<van-cell is-link />
```

View File

@ -65,3 +65,15 @@ Vue.use(Vant);
```shell ```shell
vue init youzan/vue-cli-template-vant projectName vue init youzan/vue-cli-template-vant projectName
``` ```
### Props 命名风格
Vant 文档中的 props 默认采用驼峰式命名 (camelCase)。由于 HTML 特性是不区分大小写的,如果在 HTML 中直接书写 Vue 模板,需要使用短横线分割式 (kebab-case) 的命名来传递 props
``` html
<!-- 在 JavaScript 中使用 camelCase -->
<van-cell isLink />
<!-- 在 HTML 中使用 kebab-case-->
<van-cell is-link />
```