Hello Vue

  • Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的渐进式框架。
  • Vue 只关注视图层, 采用自底向上增量开发的设计。
  • Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>

    <div id="app">
        {{name}}
        {{name}}{{name}} 
        <!-- 可以写多个 -->
        <h2>{{title}}</h2>

        <p><span>{{name}}</span>{{message}}</p>
    </div>

    <script src="../js/vue.js"></script>
    <script>
        //编程范式:声明式编程

        //let (在es6 变量) const(es6 常量)
        let name = 'way'

        //var是js早期的设计缺陷,是没有变量的作用域这个概念的
        //var app = new Vue({
            
        //})

        const app = new Vue({
            el: '#app',//用于挂在要管理的元素
            data: { //定义数据
                title: '用Vue有什么好处呢?',
                name: '张三',
                message: '其中一个好处就是可以做到数据和界面完全分离'
            }
        })

        
    </script>
</body>
</html>