Skip to content

0.10.0 Release Candidate

Pre-release
Pre-release
Compare
Choose a tag to compare
@yyx990803 yyx990803 released this 17 Mar 17:34
· 3593 commits to main since this release

New

  • Literal directives can now contain mustache interpolation tags. These tags will be evaluated once at compile time. An example would be conditionally choose which component to create with v-component="{{type}}".
  • Attributes listed in the paramAttributes option now accept mustache interpolations too. They will also only be evaluated once.
  • v-repeat now accepts an argument which will be used as the identifier for the wrapped object. This allows more explicit property access in repeaters.
  • Added v-view directive which binds to a string value and dynamically instantiate different components using that string as the component ID. See the updated routing example.
  • Added filterBy and orderBy filters for v-repeat. example
  • Custom filters that access properties on its this context will be considered computed filters. Any directive that uses a computed filter will be forced into a computed directive even when the binding is a simple keypath.
  • You can now access the event in v-on handler expressions as $event. Example: <a v-on="click:handle('hello', $event)">Hello</a>
  • Interpolation delimiters can now be customized via the delimiters global config option. Example: Vue.config({ delimiters: ["[", "]"] }) will change the matched interpolation tags to [[ ]] for text bindings and [[[ ]]] for html bindings.

Changed

  • To use a component as a custom element, the component ID must now contain a hyphen (-). This is consistent with the current custom element spec draft.
  • v-repeat Arrays' augmented methods have been renamed to $set(index, value) and $remove(index | value) to better differentiate from native methods. The replace method has been removed.
  • When iterating over an Object with v-repeat, the object no longer gets a $repeater array. Instead, the object is now augmented with two methods: $add(key, value) and $delete(key), which will trigger corresponding view updates.
  • Production build now strips all warnings and debug logs. To leverage debug: true you now have to use the development version.
  • v-if now creates and destroys a child ViewModel instance when the binding value changes, instead of simply removing/inserting the DOM node. In addition, it can no longer be used with v-repeat. Use v-show or the new built-in array filters instead.
  • v-with can no longer be used alone. It now must be used with either v-component or v-view. v-component can also be used as an empty directive just to create a child VM using the default Vue constructor.

Fixed

  • event.stopPropagation() and event.preventDefault() inside v-on handlers now work as expected.
  • parent option now works properly when used in Vue.extend
  • Mustache bindings inside <textarea> are now properly interpolated before being set as value.

Internal

  • v-component, v-with and v-if have been re-written for a cleaner compile flow.
  • v-repeat has been re-written to use refined diff algorithm which triggers minimum DOM manipulations when the array is set to a different instance containing overlapping elements. This makes it efficient to pipe an Array through filters.
  • The compiling procedure has been further optimized and instantiation perf has increased roughly 20%.