Vue.js 是什么

Vue.js 是什么

Vue.js（读音 /vjuː/, 类似于 view） 是一套构建用户界面的 渐进式框架。Vue 采用自底向上增量开发的设计。

Vue 的核心库只关注视图层。

单页应用：Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。

渐进式框架:

声明式渲染和组建系统是Vue的核心库所包含内容，而客户端路由、状态管理、构建工具都有专门解决方案。

这些解决方案相互独立，你可以在核心的基础上任意选用其他的部件，不一定要全部整合在一起。

 

上几个简单的例子

声明式渲染

---

Vue.js 的核心是一个允许你采用简洁的模板语法来声明式的将数据渲染进 DOM 的系统：

    <div id="app">
        {{ message }}
    </div>

    var app = new Vue({
      el: '#app',
      data: {
       message: 'Hello Vue!'
      }
    })

条件

---

控制切换一个元素的显示也相当简单：

    <div id="app-3">
      <p v-if="seen">Now you see me</p>
    </div>

    var app3 = new Vue({
      el: '#app-3',
      data: {
      seen: true
      }
    })

继续在控制台设置 app3.seen = false，你会发现 “Now you see me” 消失了。

循环

---

v-for指令可以绑定数据到数据来渲染一个列表：

---

    <div id="app-4">
      <ol>
        <li v-for="todo in todos">
          {{ todo.text }}
        </li>
      </ol>
    </div>

     var app4 = new Vue({
        el: '#app-4',
        data: {
        todos: [
            { text: 'Learn JavaScript' },
            { text: 'Learn Vue' },
            { text: 'Build something awesome' }
            ]
        }
      })

 

 

注意:vue.js不支持IE8及以下的IE版本.