Skip to content

Lint #1077

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Apr 15, 2020
Merged

Lint #1077

Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions src/v2/api/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -2716,3 +2716,5 @@ type: api

<!-- zhlint ignore: { `enter`: number, `leave`: number } -->
<!-- zhlint ignore: ( , ) -->
<!-- zhlint ignore: vm.$destroy() -->
<!-- zhlint ignore: vm.$forceUpdate() -->
6 changes: 3 additions & 3 deletions src/v2/guide/comparison.md
Original file line number Diff line number Diff line change
Expand Up @@ -176,7 +176,7 @@ Angular 事实上必须用 TypeScript 来开发,因为它的文档和学习资

然而,并不是所有人都想用 TS——在中小型规模的项目中,引入 TS 可能并不会带来太多明显的优势。在这些情况下,用 Vue 会是更好的选择,因为在不用 TS 的情况下使用 Angular 会很有挑战性。

最后,虽然 Vue 和 TS 的整合可能不如 Angular 那么深入,我们也提供了官方的 [类型声明](https://github.com/vuejs/vue/tree/dev/types)[组件装饰器](https://github.com/vuejs/vue-class-component),并且知道有大量用户在生产环境中使用 Vue + TS 的组合。我们也和微软的 TS / VSCode 团队进行着积极的合作,目标是为 Vue + TS 用户提供更好的类型检查和 IDE 开发体验。
最后,虽然 Vue 和 TS 的整合可能不如 Angular 那么深入,我们也提供了官方的[类型声明](https://github.com/vuejs/vue/tree/dev/types)[组件装饰器](https://github.com/vuejs/vue-class-component),并且知道有大量用户在生产环境中使用 Vue + TS 的组合。我们也和微软的 TS / VSCode 团队进行着积极的合作,目标是为 Vue + TS 用户提供更好的类型检查和 IDE 开发体验。

### 运行时性能

Expand All @@ -192,7 +192,7 @@ Vue 相比于 Angular 更加灵活,Vue 官方提供了构建工具来协助你

### 学习曲线

要学习 Vue,你只需要有良好的 HTML 和 JavaScript 基础。有了这些基本的技能,你就可以非常快速地通过阅读 [指南](./) 投入开发。
要学习 Vue,你只需要有良好的 HTML 和 JavaScript 基础。有了这些基本的技能,你就可以非常快速地通过阅读[指南](./)投入开发。

Angular 的学习曲线是非常陡峭的——作为一个框架,它的 API 面积比起 Vue 要大得多,你也因此需要理解更多的概念才能开始有效率地工作。当然,Angular 本身的复杂度是因为它的设计目标就是只针对大型的复杂应用;但不可否认的是,这也使得它对于经验不甚丰富的开发者相当的不友好。

Expand Down Expand Up @@ -226,5 +226,5 @@ Polymer 是另一个由谷歌赞助的项目,事实上也是 Vue 的一个灵

Riot 3.0 提供了一个类似于基于组件的开发模型 (在 Riot 中称之为 Tag),它提供了小巧精美的 API。Riot 和 Vue 在设计理念上可能有许多相似处。尽管相比 Riot,Vue 要显得重一点,Vue 还是有很多显著优势的:

- 更好的性能。Riot 使用了 [遍历 DOM 树](https://v3.riotjs.now.sh/compare/#virtual-dom-vs-expressions-binding) 而不是虚拟 DOM,但实际上用的还是脏检查机制,因此和 AngularJS 患有相同的性能问题。
- 更好的性能。Riot 使用了[遍历 DOM 树](https://v3.riotjs.now.sh/compare/#virtual-dom-vs-expressions-binding)而不是虚拟 DOM,但实际上用的还是脏检查机制,因此和 AngularJS 患有相同的性能问题。
- 更多成熟工具的支持。Vue 提供官方支持 [webpack](https://github.com/vuejs/vue-loader) 和 [Browserify](https://github.com/vuejs/vueify),而 Riot 是依靠社区来建立集成系统。
2 changes: 1 addition & 1 deletion src/v2/guide/components-dynamic-async.md
Original file line number Diff line number Diff line change
Expand Up @@ -197,7 +197,7 @@ new Vue({

<p class="tip">注意这个 `<keep-alive>` 要求被切换到的组件都有自己的名字,不论是通过组件的 `name` 选项还是局部/全局注册。</p>

你可以在 [API 参考文档](../api/#keep-alive) 查阅更多关于 `<keep-alive>` 的细节。
你可以在 [API 参考文档](../api/#keep-alive)查阅更多关于 `<keep-alive>` 的细节。

## 异步组件

Expand Down
2 changes: 1 addition & 1 deletion src/v2/guide/components-slots.md
Original file line number Diff line number Diff line change
Expand Up @@ -98,7 +98,7 @@ Vue 实现了一套内容分发的 API,这套 API 的设计灵感源自 [Web C
</button>
```

现在当我在一个父级组件中使用 `<submit-button>` 并且不提供任何插槽内容时:
现在当我在一个父级组件中使用 `<submit-button>` 并且不提供任何插槽内容时:

```html
<submit-button></submit-button>
Expand Down
2 changes: 1 addition & 1 deletion src/v2/guide/components.md
Original file line number Diff line number Diff line change
Expand Up @@ -334,7 +334,7 @@ Vue.component('blog-post', {
></blog-post>
```

同时子组件可以通过调用内建的 [**`$emit`** 方法](../api/#vm-emit) 并传入事件名称来触发一个事件:
同时子组件可以通过调用内建的 [**`$emit`** 方法](../api/#vm-emit)并传入事件名称来触发一个事件:

```html
<button v-on:click="$emit('enlarge-text')">
Expand Down
2 changes: 1 addition & 1 deletion src/v2/guide/conditional.md
Original file line number Diff line number Diff line change
Expand Up @@ -191,4 +191,4 @@ new Vue({

<p class="tip">**不推荐**同时使用 `v-if` 和 `v-for`。请查阅[风格指南](/v2/style-guide/#避免-v-if-和-v-for-用在一起-必要)以获取更多信息。</p>

当 `v-if` 与 `v-for` 一起使用时,`v-for` 具有比 `v-if` 更高的优先级。请查阅[列表渲染指南](list.html#v-for-with-v-if) 以获取详细信息。
当 `v-if` 与 `v-for` 一起使用时,`v-for` 具有比 `v-if` 更高的优先级。请查阅[列表渲染指南](list.html#v-for-with-v-if)以获取详细信息。
2 changes: 1 addition & 1 deletion src/v2/guide/instance.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ var vm = new Vue({

虽然没有完全遵循 [MVVM 模型](https://zh.wikipedia.org/wiki/MVVM),但是 Vue 的设计也受到了它的启发。因此在文档中经常会使用 `vm` (ViewModel 的缩写) 这个变量名表示 Vue 实例。

当创建一个 Vue 实例时,你可以传入一个**选项对象**。这篇教程主要描述的就是如何使用这些选项来创建你想要的行为。作为参考,你也可以在 [API 文档](../api/#选项-数据) 中浏览完整的选项列表。
当创建一个 Vue 实例时,你可以传入一个**选项对象**。这篇教程主要描述的就是如何使用这些选项来创建你想要的行为。作为参考,你也可以在 [API 文档](../api/#选项-数据)中浏览完整的选项列表。

一个 Vue 应用由一个通过 `new Vue` 创建的**根 Vue 实例**,以及可选的嵌套的、可复用的组件树组成。举个例子,一个 todo 应用的组件树可以是这样的:

Expand Down
2 changes: 1 addition & 1 deletion src/v2/guide/join.md
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ Vue.js 的社区正在急速增长中,如果你正在阅读本文,这说明

### 翻译文档

Vue 已经在全球范围内传播开来,核心团队成员甚至来自至少 6 个时区。[论坛](https://forum.vuejs.org/) 已有 7 种语言,数字还在持续增长。我们许多文档都有[积极维护的翻译](https://github.com/vuejs?utf8=%E2%9C%93&q=vuejs.org)。我们非常为 Vue 的国际影响力骄傲,但我们还能做得更好。
Vue 已经在全球范围内传播开来,核心团队成员甚至来自至少 6 个时区。[论坛](https://forum.vuejs.org/)已有 7 种语言,数字还在持续增长。我们许多文档都有[积极维护的翻译](https://github.com/vuejs?utf8=%E2%9C%93&q=vuejs.org)。我们非常为 Vue 的国际影响力骄傲,但我们还能做得更好。

我希望现在你正在使用你的首选语言阅读这篇文档,如果不是,你愿意帮助我们翻译它吗?

Expand Down
8 changes: 4 additions & 4 deletions src/v2/guide/migration-vue-router.md
Original file line number Diff line number Diff line change
Expand Up @@ -308,7 +308,7 @@ export default {
<router-link to="/about">About</router-link>
```

注意:`<router-link>`不支持 `target="_blank"` 属性,如果你想打开一个新标签页,你必须用`<a>`标签。
注意:`<router-link>` 不支持 `target="_blank"` 属性,如果你想打开一个新标签页,你必须用 `<a>` 标签。

{% raw %}
<div class="upgrade-path">
Expand All @@ -335,7 +335,7 @@ export default {
</router-link>
```

`<a>`标签将会成为真实的链接 (并且可以获取到正确的跳转),但是激活的类将会被应用在外部的`<li>`标签上。
`<a>` 标签将会成为真实的链接 (并且可以获取到正确的跳转),但是激活的类将会被应用在外部的 `<li>` 标签上。

{% raw %}
<div class="upgrade-path">
Expand All @@ -348,7 +348,7 @@ export default {

### `router.go` <sup>改变</sup>

为了与 [HTML5 History API](https://developer.mozilla.org/en-US/docs/Web/API/History_API) 保持一致性,`router.go` 已经被用来作为 [后退/前进导航](https://router.vuejs.org/zh-cn/essentials/navigation.html#routergon),[`router.push`](https://router.vuejs.org/zh-cn/essentials/navigation.html#routerpushlocation) 用来导向特殊页面。
为了与 [HTML5 History API](https://developer.mozilla.org/en-US/docs/Web/API/History_API) 保持一致性,`router.go` 已经被用来作为[后退/前进导航](https://router.vuejs.org/zh-cn/essentials/navigation.html#routergon),[`router.push`](https://router.vuejs.org/zh-cn/essentials/navigation.html#routerpushlocation) 用来导向特殊页面。

{% raw %}
<div class="upgrade-path">
Expand Down Expand Up @@ -447,7 +447,7 @@ scrollBehavior: function (to, from, savedPosition) {

### `root` <sup>换名</sup>

为了与 [HTML 的`<base>` 标签](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base)保持一致性,重命名为 `base`。
为了与 [HTML 的 `<base>` 标签](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base)保持一致性,重命名为 `base`。

{% raw %}
<div class="upgrade-path">
Expand Down
2 changes: 1 addition & 1 deletion src/v2/guide/migration-vuex.md
Original file line number Diff line number Diff line change
Expand Up @@ -83,7 +83,7 @@ const myPlugins = store => {
}
```

更多详情,请查阅 [插件文档](https://github.com/vuejs/vuex/blob/1.0/docs/en/plugins.md)。
更多详情,请查阅[插件文档](https://github.com/vuejs/vuex/blob/1.0/docs/en/plugins.md)。

{% raw %}
<div class="upgrade-path">
Expand Down
4 changes: 2 additions & 2 deletions src/v2/guide/single-file-components.md
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ order: 401
- **不支持 CSS (No CSS support)** 意味着当 HTML 和 JavaScript 组件化时,CSS 明显被遗漏
- **没有构建步骤 (No build step)** 限制只能使用 HTML 和 ES5 JavaScript,而不能使用预处理器,如 Pug (formerly Jade) 和 Babel

文件扩展名为 `.vue` 的 **single-file components(单文件组件)** 为以上所有问题提供了解决方法,并且还可以使用 webpack 或 Browserify 等构建工具。
文件扩展名为 `.vue` 的 **single-file components (单文件组件)** 为以上所有问题提供了解决方法,并且还可以使用 webpack 或 Browserify 等构建工具。

这是一个文件名为 `Hello.vue` 的简单实例:

Expand Down Expand Up @@ -70,4 +70,4 @@ order: 401

CLI 会为你搞定大多数工具的配置问题,同时也支持细粒度自定义[配置项](https://cli.vuejs.org/zh/config/)。

有时你会想从零搭建你自己的构建工具,这时你需要通过 [Vue Loader](https://vue-loader.vuejs.org/zh/) 手动配置 webpack。关于学习更多 webpack 的内容,请查阅[其官方文档](https://webpack.js.org/configuration/) 和 [Webpack Academy](https://webpack.academy/p/the-core-concepts)。
有时你会想从零搭建你自己的构建工具,这时你需要通过 [Vue Loader](https://vue-loader.vuejs.org/zh/) 手动配置 webpack。关于学习更多 webpack 的内容,请查阅[其官方文档](https://webpack.js.org/configuration/)和 [Webpack Academy](https://webpack.academy/p/the-core-concepts)。
12 changes: 6 additions & 6 deletions src/v2/guide/transitions.md
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ Vue 在插入、更新或者移除 DOM 时,提供多种不同方式的应用
- 在过渡钩子函数中使用 JavaScript 直接操作 DOM
- 可以配合使用第三方 JavaScript 动画库,如 Velocity.js

在这里,我们只会讲到进入、离开和列表的过渡,你也可以看下一节的 [管理过渡状态](transitioning-state.html)。
在这里,我们只会讲到进入、离开和列表的过渡,你也可以看下一节的[管理过渡状态](transitioning-state.html)。

## 单元素/组件的过渡

Expand Down Expand Up @@ -98,13 +98,13 @@ new Vue({

2. `v-enter-active`:定义进入过渡生效时的状态。在整个进入过渡的阶段中应用,在元素被插入之前生效,在过渡/动画完成之后移除。这个类可以被用来定义进入过渡的过程时间,延迟和曲线函数。

3. `v-enter-to`:**2.1.8 版及以上** 定义进入过渡的结束状态。在元素被插入之后下一帧生效 (与此同时 `v-enter` 被移除),在过渡/动画完成之后移除。
3. `v-enter-to`:**2.1.8 版及以上**定义进入过渡的结束状态。在元素被插入之后下一帧生效 (与此同时 `v-enter` 被移除),在过渡/动画完成之后移除。

4. `v-leave`:定义离开过渡的开始状态。在离开过渡被触发时立刻生效,下一帧被移除。

5. `v-leave-active`:定义离开过渡生效时的状态。在整个离开过渡的阶段中应用,在离开过渡被触发时立刻生效,在过渡/动画完成之后移除。这个类可以被用来定义离开过渡的过程时间,延迟和曲线函数。

6. `v-leave-to`:**2.1.8 版及以上** 定义离开过渡的结束状态。在离开过渡被触发之后下一帧生效 (与此同时 `v-leave` 被删除),在过渡/动画完成之后移除。
6. `v-leave-to`:**2.1.8 版及以上**定义离开过渡的结束状态。在离开过渡被触发之后下一帧生效 (与此同时 `v-leave` 被删除),在过渡/动画完成之后移除。

![Transition Diagram](/images/transition.png)

Expand Down Expand Up @@ -785,7 +785,7 @@ new Vue({
</style>
{% endraw %}

同时生效的进入和离开的过渡不能满足所有要求,所以 Vue 提供了 **过渡模式**
同时生效的进入和离开的过渡不能满足所有要求,所以 Vue 提供了**过渡模式**

- `in-out`:新元素先进行过渡,完成之后当前元素过渡离开。

Expand Down Expand Up @@ -960,7 +960,7 @@ new Vue({

- 不同于 `<transition>`,它会以一个真实元素呈现:默认为一个 `<span>`。你也可以通过 `tag` attribute 更换为其他元素。
- [过渡模式](#过渡模式)不可用,因为我们不再相互切换特有的元素。
- 内部元素 **总是需要** 提供唯一的 `key` 属性值。
- 内部元素**总是需要**提供唯一的 `key` 属性值。
- CSS 过渡的类将会应用在内部的元素中,而不是这个组/容器本身。

### 列表的进入/离开过渡
Expand Down Expand Up @@ -1519,7 +1519,7 @@ Vue.component('my-special-transition', {
<!-- ... -->
</transition>
```
当你想用 Vue 的过渡系统来定义的 CSS 过渡/动画 在不同过渡间切换会非常有用
当你想用 Vue 的过渡系统来定义的 CSS 过渡/动画在不同过渡间切换会非常有用

所有过渡 attribute 都可以动态绑定,但我们不仅仅只有 attribute 可以利用,还可以通过事件钩子获取上下文中的所有数据,因为事件钩子都是方法。这意味着,根据组件的状态不同,你的 JavaScript 过渡会有不同的表现。

Expand Down
2 changes: 1 addition & 1 deletion src/v2/guide/unit-testing.md
Original file line number Diff line number Diff line change
Expand Up @@ -113,7 +113,7 @@ describe('MyComponent', () => {

## 断言异步更新

由于 Vue 进行 [异步更新 DOM](reactivity.html#异步更新队列) 的情况,一些依赖 DOM 更新结果的断言必须在 `vm.$nextTick()` resolve 之后进行:
由于 Vue 进行[异步更新 DOM](reactivity.html#异步更新队列) 的情况,一些依赖 DOM 更新结果的断言必须在 `vm.$nextTick()` resolve 之后进行:

``` js
// 在状态更新后检查生成的 HTML
Expand Down
2 changes: 1 addition & 1 deletion src/v2/style-guide/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -1857,7 +1857,7 @@ computed: {

为了给样式设置作用域,Vue 会为元素添加一个独一无二的 attribute,例如 `data-v-f3f3eg9`。然后修改选择器,使得在匹配选择器的元素中,只有带这个 attribute 才会真正生效 (比如 `button[data-v-f3f3eg9]`)。

问题在于大量的[元素和 attribute 组合的选择器](http://stevesouders.com/efws/css-selectors/csscreate.php?n=1000&sel=a%5Bhref%5D&body=background%3A+%23CFD&ne=1000) (比如 `button[data-v-f3f3eg9]`) 会比[类和 attribute 组合的选择器](http://stevesouders.com/efws/css-selectors/csscreate.php?n=1000&sel=.class%5Bhref%5D&body=background%3A+%23CFD&ne=1000) 慢,所以应该尽可能选用类选择器。
问题在于大量的[元素和 attribute 组合的选择器](http://stevesouders.com/efws/css-selectors/csscreate.php?n=1000&sel=a%5Bhref%5D&body=background%3A+%23CFD&ne=1000) (比如 `button[data-v-f3f3eg9]`) 会比[类和 attribute 组合的选择器](http://stevesouders.com/efws/css-selectors/csscreate.php?n=1000&sel=.class%5Bhref%5D&body=background%3A+%23CFD&ne=1000)慢,所以应该尽可能选用类选择器。

{% raw %}</details>{% endraw %}

Expand Down