What are the characteristics of vue.js?

The main features of Vue.js: 1. Lightweight, the script is very light and the performance is very fast; 2. Two-way data binding; 3. Instructions, when the value of its expression changes, it will be changed accordingly. Certain behaviors are applied to the DOM; 4. Componentization, extensible HTML elements, and encapsulation of reusable code; 5. Client routing; 6. State management.

Vue.js (pronounced /vju:/, pronounced similar to view) is a progressive framework for building user interfaces. Unlike other heavyweight frameworks, Vue adopts a bottom-up incremental development design.

Vue’s core library only focuses on the view layer, and is very easy to learn and integrate with other libraries or existing projects. Vue is fully capable of powering complex single-page applications developed with single-file components and libraries supported by the Vue ecosystem.

Vue.js also provides MVVM data binding and a composable component system, with a simple and flexible API. Its goal is to achieve responsive data binding and composability through the simplest possible API. view component.

We can also say that Vue.js is a responsive system (Reactivity System). The data model layer (Model) is just an ordinary JavaScript object. As shown in the figure below, { } represents a JavaScript object. Modifying it updates the corresponding HTML fragment (DOM). These HTML fragments are also called "views". This will make state management very simple and intuitive, and can realize two-way binding of data, so we also call it a responsive system.

The main features of Vue.js

Vue.js is an excellent front-end interface for developing JavaScript Library, the reason why it is very popular is that it has many outstanding features, the main features of which are as follows.

1) Lightweight framework

Vue.js can automatically track dependent template expressions and calculated properties, provide MVVM data binding and a composable The component system has a simple and flexible API, making it easier for readers to understand and get started faster.

2) Two-way data binding

Declarative rendering is the main embodiment of two-way data binding and is also the core of Vue.js. It allows the use of concise templates The syntax integrates declarative rendering of data into the DOM.

3) Instructions

Vue.js has many built-in instructions, such as: v-if, v-else, v-show, v-on, v-bind and v-model, these directives are used to perform various operations on the front end.

Vue.js interacts with the page mainly through built-in instructions. The function of the instructions is to apply certain behaviors to the DOM accordingly when the value of its expression changes.

4) Componentization

Component is one of the most powerful features of Vue.js. Components can extend HTML elements, encapsulating reusable code.

In Vue, parent-child components communicate through props, one-way transmission from parent to child. The child component communicates with the parent component and notifies the parent component of data changes by triggering events. This forms a basic father-child communication model.

When the components during development have a very close relationship with HTML, JavaScript, etc., the components can be customized according to actual needs, making development more convenient and greatly reducing the amount of code writing.

The component also supports hot reload. When we make changes, the page will not be refreshed, but the component itself will be reloaded immediately, without affecting the current state of the entire application. CSS also supports hot reloading.

5) Client routing

Vue-router is the official routing plug-in of Vue.js. It is deeply integrated with Vue.js and used to build single-page applications. Vue single-page applications are based on routing and components. Routing is used to set access paths and map paths and components. Traditional pages implement page switching and jumps through hyperlinks.

6) State management

State management is actually a one-way data flow. State drives the rendering of View, and the user operates the View to generate Action, which makes the State Changes occur, causing the View to re-render and form a separate component.

Related recommendations:

2020 front-end vue interview questions summary (with answers)

vue tutorial Recommendation: The latest 5 vue.js video tutorial selections in 2020

For more programming-related knowledge, please visit: Programming Course! !

The above is the detailed content of What are the characteristics of vue.js?. For more information, please follow other related articles on the PHP Chinese website!