Shulou(Shulou.com)06/01 Report--

This article introduces you how to introduce vue2.0, the content is very detailed, interested friends can refer to, hope to be helpful to you.

Vue

Vue is a progressive framework for building user interfaces. Author you Yuxi emphasizes that unlike other frameworks, Vue is a progressive framework that can be adopted step by step without having to ReFactor the project through the framework at once. In addition, Vue's core libraries focus only on the view layer, making it easier to integrate with other libraries or existing projects, and more flexible.

Vue does not support the following versions of IE8 browsers in terms of compatibility. It uses the features of ECMAScript 5. All browsers that support ECMAScript 5 are fine, like these:

Installation

If you are already familiar with and install webpack, you can directly install a CLI version of the command line tool, which is quick and convenient.

$npm install-- global vue-cli # install vue-cli. $vue init webpack my-project # build a new project using the "webpack" template. $cd my-project $npm install # installs dependent libraries. $npm run dev # run.

If you want the latest source code to compile yourself, you can download it on github:

$git clone https://github.com/vuejs/vue.git node_modules/vue$ cd node_modules/vue$ npm install$ npm run build

If you are just learning first, it is recommended that you install the latest stable version with npm:

$npm install vueHello World

The use of vue is relatively simple. We can look at a few small examples, such as hello vue.js, and create an instance through the constructor:

Var vm = new Vue ({el:'# demo', data: {msg:'Hello vue.jsgiving'}})

In the html file, you can get the data by making a reference to the simple template syntax.

{{msg}}

The effect is as follows:

To allow users to interact with our application, we can process user input by using the v-on instruction. In vue.js, * * v murals * prefix instructions, such as v-on (event), v-for (loop), v-bind (binding attribute), and so on.

Html:

{{msg}}

Reverse Message

Js:

Var vm = new Vue ({el:'# demo', data: {msg: 'Hello Vue.jskeeper'}, methods: {reverseMessage: function () {this.msg = this.msg.split (''). Reverse (). Join (')}})

The effect is as follows:

Vue also provides v-model instructions to make bidirectional binding between form input and WEB applications very simple:

Html:

{{msg}}

Js:

Var vm = new Vue ({el:'# demo', data: {msg: 'Hello demo', data'}})

The effect is as follows:

Vue is relatively easy to use.

On how to introduce vue2.0 to share here, I hope that the above content can be of some help to you, can learn more knowledge. If you think the article is good, you can share it for more people to see.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.