Home >Web Front-end >JS Tutorial >Learn about the Vue framework in three minutes

Learn about the Vue framework in three minutes

烟雨青岚
烟雨青岚forward
2020-06-23 12:01:312597browse

Learn about the Vue framework in three minutes

Understand the Vue framework in three minutes

##1. Basic introduction to Vue

1.vue is a progressive JavaScript framework

2. Author: You Yuxi (a Chinese former Google engineer)

3. Function: dynamically build user interface

2: Features of Vue

1. Follow the MVVM pattern (m->model (data object) v->view (view) vm->view model)

2. The coding is simple, the size is small, and the running efficiency is high, suitable for mobile/PC terminals

3. It only focuses on the UI, and can easily introduce Vue plug-ins or other third-party library development projects

Vue extension plug-in:

  • vue-cli:Vue scaffolding

  • vue-resource(axios ):ajax request

  • vue-router:routing

  • vuex:state management

  • vue -lazyload: Image lazy loading

  • vue-scroller: Page sliding related

  • mint-ui: Vue-based UI component library (mobile terminal )

  • element-ui: Vue-based UI component library (PC side)

3. Vue writes "Hello vue"

1.Introduce vue.js

2.Create vue object

3.Two-way data binding

4.Display data

Code display:

<p id="app">
    //3.双向数据绑定
    <input type="text" v-model="username">
    //4.显示数据
    <p>Hello {{msg}}</p>
</p>
//1.引入vue.js
<script type="text/javascript" src="../js/vue.js"></script>
<script type="text/javascript">
    //2.创建vue对象
    var vm = new Vue({
        el:"#app",
        data:{
            msg:&#39;vue&#39;
        }
    })

Thank you everyone for reading, I hope you will benefit a lot.

This article is reproduced from: https://blog.csdn.net/weixin_44022886/article/details/88868789

Recommended tutorial: "

JS Tutorial"

The above is the detailed content of Learn about the Vue framework in three minutes. For more information, please follow other related articles on the PHP Chinese website!

Statement:
This article is reproduced at:csdn.net. If there is any infringement, please contact admin@php.cn delete