diff --git a/src/v2/api/index.md b/src/v2/api/index.md index ad2f422fbc..ac10d7249c 100644 --- a/src/v2/api/index.md +++ b/src/v2/api/index.md @@ -79,15 +79,15 @@ type: api Assign a handler for uncaught errors during component render function and watchers. The handler gets called with the error and the Vue instance. - > In 2.2.0, this hook also captures errors in component lifecycle hooks. Also, when this hook is `undefined`, captured errors will be logged with `console.error` instead of crashing the app. + > In 2.2.0+, this hook also captures errors in component lifecycle hooks. Also, when this hook is `undefined`, captured errors will be logged with `console.error` instead of crashing the app. - > In 2.4.0 this hook also captures errors thrown inside Vue custom event handlers. + > In 2.4.0+ this hook also captures errors thrown inside Vue custom event handlers. > [Sentry](https://sentry.io), an error tracking service, provides [official integration](https://sentry.io/for/vue/) using this option. ### warnHandler -> New in 2.4.0 +> New in 2.4.0+ - **Type:** `Function` @@ -147,11 +147,11 @@ type: api ### performance -> New in 2.2.0 +> New in 2.2.0+ - **Type:** `boolean` -- **Default:** `false (from 2.2.3)` +- **Default:** `false (from 2.2.3+)` - **Usage**: @@ -159,7 +159,7 @@ type: api ### productionTip -> New in 2.2.0 +> New in 2.2.0+ - **Type:** `boolean` @@ -229,7 +229,7 @@ type: api }) ``` - > New in 2.1.0: returns a Promise if no callback is provided and Promise is supported in the execution environment. + > New in 2.1.0+: returns a Promise if no callback is provided and Promise is supported in the execution environment. - **See also:** [Async Update Queue](../guide/reactivity.html#Async-Update-Queue) @@ -677,7 +677,7 @@ if (version === 2) { ### renderError -> New in 2.2.0 +> New in 2.2.0+ - **Type:** `(createElement: () => VNode, error: Error) => VNode` @@ -928,7 +928,7 @@ All lifecycle hooks automatically have their `this` context bound to the instanc ### provide / inject -> New in 2.2.0 +> New in 2.2.0+ - **Type:** - **provide:** `Object | () => Object` @@ -983,7 +983,7 @@ All lifecycle hooks automatically have their `this` context bound to the instanc } ``` - > The next 2 examples only work with Vue > 2.2.1. Below that version, injected values were resolved after the `props` and the `data` initialization. + > The next 2 examples work with Vue 2.2.1+. Below that version, injected values were resolved after the `props` and the `data` initialization. Using an injected value as the default for a prop: ```js @@ -1102,7 +1102,7 @@ All lifecycle hooks automatically have their `this` context bound to the instanc ### inheritAttrs -> New in 2.4.0 +> New in 2.4.0+ - **Type:** `boolean` @@ -1114,7 +1114,7 @@ All lifecycle hooks automatically have their `this` context bound to the instanc ### comments -> New in 2.4.0 +> New in 2.4.0+ - **Type:** `boolean` @@ -1138,7 +1138,7 @@ All lifecycle hooks automatically have their `this` context bound to the instanc ### vm.$props -> New in 2.2.0 +> New in 2.2.0+ - **Type:** `Object` @@ -1257,7 +1257,7 @@ All lifecycle hooks automatically have their `this` context bound to the instanc ### vm.$scopedSlots -> New in 2.1.0 +> New in 2.1.0+ - **Type:** `{ [name: string]: props => VNode | Array }` @@ -1527,7 +1527,7 @@ All lifecycle hooks automatically have their `this` context bound to the instanc Defer the callback to be executed after the next DOM update cycle. Use it immediately after you've changed some data to wait for the DOM update. This is the same as the global `Vue.nextTick`, except that the callback's `this` context is automatically bound to the instance calling this method. - > New in 2.1.0: returns a Promise if no callback is provided and Promise is supported in the execution environment. + > New in 2.1.0+: returns a Promise if no callback is provided and Promise is supported in the execution environment. - **Example:** @@ -1653,7 +1653,7 @@ All lifecycle hooks automatically have their `this` context bound to the instanc ### v-else-if -> New in 2.1.0 +> New in 2.1.0+ - **Expects:** `any` @@ -1743,7 +1743,7 @@ All lifecycle hooks automatically have their `this` context bound to the instanc Attaches an event listener to the element. The event type is denoted by the argument. The expression can either be a method name or an inline statement, or simply omitted when there are modifiers present. - Starting in `2.4.0`, `v-on` also supports binding to an object of event/listener pairs without an argument. Note when using the object syntax, it does not support any modifiers. + Starting in 2.4.0+, `v-on` also supports binding to an object of event/listener pairs without an argument. Note when using the object syntax, it does not support any modifiers. When used on a normal element, it listens to **native DOM events** only. When used on a custom element component, it also listens to **custom events** emitted on that child component. @@ -2185,7 +2185,7 @@ All lifecycle hooks automatically have their `this` context bound to the instanc When a component is toggled inside ``, its `activated` and `deactivated` lifecycle hooks will be invoked accordingly. - > In 2.2.0 and above, `activated` and `deactivated` will fire for all nested components inside a `` tree. + > In 2.2.0+ and above, `activated` and `deactivated` will fire for all nested components inside a `` tree. Primarily used with preserve component state or avoid re-rendering. @@ -2214,7 +2214,7 @@ All lifecycle hooks automatically have their `this` context bound to the instanc - **`include` and `exclude`** - > New in 2.1.0 + > New in 2.1.0+ The `include` and `exclude` props allow components to be conditionally cached. Both props can be a comma-delimited string, a RegExp or an Array: diff --git a/src/v2/guide/class-and-style.md b/src/v2/guide/class-and-style.md index 9554c81f63..32a28efe70 100644 --- a/src/v2/guide/class-and-style.md +++ b/src/v2/guide/class-and-style.md @@ -197,7 +197,7 @@ When you use a CSS property that requires [vendor prefixes](https://developer.mo > 2.3.0+ -Starting in 2.3 you can provide an array of multiple (prefixed) values to a style property, for example: +Starting in 2.3.0+ you can provide an array of multiple (prefixed) values to a style property, for example: ``` html
diff --git a/src/v2/guide/components.md b/src/v2/guide/components.md index c01caa3553..74fc50f6db 100644 --- a/src/v2/guide/components.md +++ b/src/v2/guide/components.md @@ -581,7 +581,7 @@ In some cases we may need "two-way binding" for a prop - in fact, in Vue 1.x thi This is why we removed the `.sync` modifier when 2.0 was released. However, we've found that there are indeed cases where it could be useful, especially when shipping reusable components. What we need to change is **making the code in the child that affects parent state more consistent and explicit.** -In 2.3 we re-introduced the `.sync` modifier for props, but this time it is just syntax sugar that automatically expands into an additional `v-on` listener: +In 2.3.0+ we re-introduced the `.sync` modifier for props, but this time it is just syntax sugar that automatically expands into an additional `v-on` listener: The following @@ -723,7 +723,7 @@ The implementation above is pretty naive though. For example, users are allowed ### Customizing Component `v-model` -> New in 2.2.0 +> New in 2.2.0+ By default, `v-model` on a component uses `value` as the prop and `input` as the event, but some input types such as checkboxes and radio buttons may want to use the `value` prop for a different purpose. Using the `model` option can avoid the conflict in such cases: @@ -935,7 +935,7 @@ The content distribution API is a very useful mechanism when designing component ### Scoped Slots -> New in 2.1.0 +> New in 2.1.0+ A scoped slot is a special type of slot that functions as a reusable template (that can be passed data to) instead of already-rendered-elements. @@ -1145,9 +1145,9 @@ new Vue({ ### Advanced Async Components -> New in 2.3.0 +> New in 2.3.0+ -Starting in 2.3 the async component factory can also return an object of the following format: +Starting in 2.3.0+ the async component factory can also return an object of the following format: ``` js const AsyncComp = () => ({ diff --git a/src/v2/guide/conditional.md b/src/v2/guide/conditional.md index 7aeb439986..599673e88d 100644 --- a/src/v2/guide/conditional.md +++ b/src/v2/guide/conditional.md @@ -57,7 +57,7 @@ A `v-else` element must immediately follow a `v-if` or a `v-else-if` element - o ### `v-else-if` -> New in 2.1.0 +> New in 2.1.0+ The `v-else-if`, as the name suggests, serves as an "else if block" for `v-if`. It can also be chained multiple times: diff --git a/src/v2/guide/events.md b/src/v2/guide/events.md index df41c51346..c822f35dce 100644 --- a/src/v2/guide/events.md +++ b/src/v2/guide/events.md @@ -196,7 +196,7 @@ To address this problem, Vue provides **event modifiers** for `v-on`. Recall tha

Order matters when using modifiers because the relevant code is generated in the same order. Therefore using `@click.prevent.self` will prevent **all clicks** while `@click.self.prevent` will only prevent clicks on the element itself.

-> New in 2.1.4 +> New in 2.1.4+ ``` html @@ -270,7 +270,7 @@ For example: ### Mouse Button Modifiers -> New in 2.2.0 +> New in 2.2.0+ - `.left` - `.right` diff --git a/src/v2/guide/render-function.md b/src/v2/guide/render-function.md index af637da36b..5bd2ce9d3f 100644 --- a/src/v2/guide/render-function.md +++ b/src/v2/guide/render-function.md @@ -468,7 +468,7 @@ Vue.component('my-component', { }) ``` -> Note: in versions <=2.3.0, the `props` option is required if you wish to accept props in a functional component. In 2.3.0+ you can omit the `props` option and all attributes found on the component node will be implicitly extracted as props. +> Note: in versions before 2.3.0, the `props` option is required if you wish to accept props in a functional component. In 2.3.0+ you can omit the `props` option and all attributes found on the component node will be implicitly extracted as props. Everything the component needs is passed through `context`, which is an object containing: diff --git a/src/v2/guide/syntax.md b/src/v2/guide/syntax.md index 7a3e515b36..bb8bbe89c6 100644 --- a/src/v2/guide/syntax.md +++ b/src/v2/guide/syntax.md @@ -130,7 +130,7 @@ Vue.js allows you to define filters that can be used to apply common text format
``` -

Vue 2.x filters can only be used inside mustache interpolations and `v-bind` expressions (the latter supported since 2.1.0), because filters are primarily designed for text transformation purposes. For more complex data transforms in other directives, you should use [Computed properties](computed.html) instead.

+

Vue 2.x filters can only be used inside mustache interpolations and `v-bind` expressions (the latter supported in 2.1.0+), because filters are primarily designed for text transformation purposes. For more complex data transforms in other directives, you should use [Computed properties](computed.html) instead.

The filter function always receives the expression's value as the first argument. diff --git a/src/v2/guide/transitions.md b/src/v2/guide/transitions.md index 2573fe3f98..a74e3080b5 100644 --- a/src/v2/guide/transitions.md +++ b/src/v2/guide/transitions.md @@ -50,7 +50,7 @@ new Vue({ .fade-enter-active, .fade-leave-active { transition: opacity .5s } -.fade-enter, .fade-leave-to /* .fade-leave-active in <2.1.8 */ { +.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ { opacity: 0 } ``` @@ -98,13 +98,13 @@ There are six classes applied for enter/leave transitions. 2. `v-enter-active`: Active state for enter. Applied during the entire entering phase. Added before element is inserted, removed when transition/animation finishes. This class can be used to define the duration, delay and easing curve for the entering transition. -3. `v-enter-to`: **Only available in versions >=2.1.8.** Ending state for enter. Added one frame after element is inserted (at the same time `v-enter` is removed), removed when transition/animation finishes. +3. `v-enter-to`: **Only available in versions 2.1.8+.** Ending state for enter. Added one frame after element is inserted (at the same time `v-enter` is removed), removed when transition/animation finishes. 4. `v-leave`: Starting state for leave. Added immediately when a leaving transition is triggered, removed after one frame. 5. `v-leave-active`: Active state for leave. Applied during the entire leaving phase. Added immediately when leave transition is triggered, removed when the transition/animation finishes. This class can be used to define the duration, delay and easing curve for the leaving transition. -6. `v-leave-to`: **Only available in versions >=2.1.8.** Ending state for leave. Added one frame after a leaving transition is triggered (at the same time `v-leave` is removed), removed when the transition/animation finishes. +6. `v-leave-to`: **Only available in versions 2.1.8+.** Ending state for leave. Added one frame after a leaving transition is triggered (at the same time `v-leave` is removed), removed when the transition/animation finishes. ![Transition Diagram](/images/transition.png) @@ -146,7 +146,7 @@ new Vue({ transition: all .8s cubic-bezier(1.0, 0.5, 0.8, 1.0); } .slide-fade-enter, .slide-fade-leave-to -/* .slide-fade-leave-active for <2.1.8 */ { +/* .slide-fade-leave-active below version 2.1.8 */ { transform: translateX(10px); opacity: 0; } @@ -289,10 +289,10 @@ You can also specify custom transition classes by providing the following attrib - `enter-class` - `enter-active-class` -- `enter-to-class` (>= 2.1.8 only) +- `enter-to-class` (2.1.8+) - `leave-class` - `leave-active-class` -- `leave-to-class` (>= 2.1.8 only) +- `leave-to-class` (2.1.8+) These will override the conventional class names. This is especially useful when you want to combine Vue's transition system with an existing CSS animation library, such as [Animate.css](https://daneden.github.io/animate.css/). @@ -356,7 +356,7 @@ However, in some cases you may want to have both on the same element, for exampl ### Explicit Transition Durations -> New in 2.2.0 +> New in 2.2.0+ In most cases, Vue can automatically figure out when the transition has finished. By default, Vue waits for the first `transitionend` or `animationend` event on the root transition element. However, this may not always be desired - for example, we may have a choreographed transition sequence where some nested inner elements have a delayed transition or a longer transition duration than the root transition element. @@ -560,7 +560,7 @@ By default, this will use the transitions specified for entering and leaving. If = 2.1.8 only) + appear-to-class="custom-appear-to-class" (2.1.8+) appear-active-class="custom-appear-active-class" > @@ -906,7 +906,7 @@ new Vue({ transition: opacity .3s ease; } .component-fade-enter, .component-fade-leave-to -/* .component-fade-leave-active for <2.1.8 */ { +/* .component-fade-leave-active below version 2.1.8 */ { opacity: 0; } ``` @@ -1002,7 +1002,7 @@ new Vue({ .list-enter-active, .list-leave-active { transition: all 1s; } -.list-enter, .list-leave-to /* .list-leave-active for <2.1.8 */ { +.list-enter, .list-leave-to /* .list-leave-active below version 2.1.8 */ { opacity: 0; transform: translateY(30px); } @@ -1178,7 +1178,7 @@ new Vue({ margin-right: 10px; } .list-complete-enter, .list-complete-leave-to -/* .list-complete-leave-active for <2.1.8 */ { +/* .list-complete-leave-active below version 2.1.8 */ { opacity: 0; transform: translateY(30px); } diff --git a/src/v2/guide/typescript.md b/src/v2/guide/typescript.md index 7e0d378353..4dd07c5486 100644 --- a/src/v2/guide/typescript.md +++ b/src/v2/guide/typescript.md @@ -4,9 +4,9 @@ type: guide order: 25 --- -## Important 2.2 Change Notice for TS + webpack 2 users +## Important 2.2.0+ Change Notice for TS + webpack 2 users -In Vue 2.2 we introduced dist files exposed as ES modules, which will be used by default by webpack 2. Unfortunately, this introduced an unintentional breaking change because with TypeScript + webpack 2, `import Vue = require('vue')` will now return a synthetic ES module object instead of Vue itself. +In Vue 2.2.0+ we introduced dist files exposed as ES modules, which will be used by default by webpack 2. Unfortunately, this introduced an unintentional breaking change because with TypeScript + webpack 2, `import Vue = require('vue')` will now return a synthetic ES module object instead of Vue itself. We plan to move all official declarations to use ES-style exports in the future. Please see [Recommended Configuration](#Recommended-Configuration) below on a future-proof setup.