Vue基础学习

Vue基础

Vue简介

1.JavaScript框架
2.简化DOM操作
3.响应式数据驱动

第一个Vue程序

<!-- 开发环境版本，包含了有帮助的命令行警告 -->
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

导入开发版本的Vue.js。
创建Vue实例对象，设置el属性和data属性。
使用简洁的模板语法，把数据渲染到页面上。

el：挂载点

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

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

①Vue实例的作用范围是什么呢？
el命中的元素内部。
②是否支持其他选择器？
建议用“id”

class = "app"
el:"#app"  <!--id-->
el:".app"  <!--class-->
el:"div"   <!--div-->

③是否可以使用其他dom元素标签？
支持双标签

data：数据对象

Vue中用到的数据定义在data中。
Data中可以写复杂的数据。
渲染复杂类型数据时，遵守js语法即可。

本文用于简单的学习记录_