Vue Class Component

Posted on  by admin

You’re browsing the documentation for v2.x and earlier.

For v3.x, click here.

Object Syntax
With Components
Array Syntax


Multiple Values


A common need for data binding is manipulating an element’s class list and its inline styles.

options:对象参数, key ,paramsIndex


Since they are both attributes, we can use v-bind to handle them: we only need to calculate a final string with our expressions.

Binding Inline Styles

However, meddling with string concatenation is annoying and error-prone. For this reason, Vue provides special enhancements when v-bind is used with class and style.

In addition to strings, the expressions can also evaluate to objects or arrays.


We can pass an object to v-bind:class to dynamically toggle classes:.