github:https://github.com/icarusion/vue-book
笔记: https://github.com/K-Artisan/vue.js-in-ation-book-note

系列目录

什么是Vue.js

使用Vue.js可以让Web开发变得简单,同时也颠覆了传统前端开发模式。它提供了现代Web开发中常见的高级功能,比如:

  • 解耦视图与数据。

  • 可复用的组件。

  • 前端路由。

  • 状态管理。

  • 虚拟DOM(Virtual DOM)。

MVVM模式

Vue.js在设计上也使用MVVM(Model-View-View Model)模式。

如何使用

传统前端开发模式

一套可称为“万金油”的技术栈被许多商业项目用于生产环境:
jQuery + RequireJS(SeaJS)+ artTemplate(doT)+Gulp(Grunt)

Vue.js开发模式

引用

安装:https://cn.vuejs.org/v2/guide/installation.html

自动识别最新稳定版本的Vue.js -->
<script src="https://unpkg.com/vue/dist/vue.min.js"></script>
<!--指定某个具体版本的Vue.js -->
<script src="https://unpkg.com/vue@2.1.6/dist/vue.min.js"></script>

简单示例

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>Vue 示例</title>
</head>

<body>
    <div >
        <ul>
            <li v-for="book in books">{{ book.name }}</li>
        </ul>
    </div>
    <script src="https://unpkg.com/vue/dist/vue.min.js"></script>
    <script>
        new Vue({
            el: '#app',
            data: {
                books: [
                    { name: '《Vue.js实战》' },
                    { name: '《JavaScript语言精粹》' },
                    { name: '《JavaScript高级程序设计》' }
                ]
            }
        })
    </script>
</body>

</html>

下一篇

相关文章:

  • 2019-09-25
  • 2021-08-18
  • 2021-11-02
  • 2021-09-10
  • 2022-02-03
  • 2021-06-11
  • 2021-07-11
  • 2021-08-13
猜你喜欢
  • 2021-10-29
  • 2021-05-20
  • 2021-07-18
  • 2022-12-23
  • 2022-01-03
  • 2021-12-05
相关资源
相似解决方案