【自学】Vues基础

学习目录

1. Vues基础
2. 本地应用
3. 网络应用
4. 综合应用

工具的准备

我个人比较喜欢使用HTMLDROWNER，学习资料推荐使用VC，仅供选择吧

前置知识

HTML+CSS+JS+AJAX：这个是学习资料博主推荐的

个人感觉认真学好HTML+CSS+JS理解vues基础很容易上手

官方网址

Vue.js - 渐进式 JavaScript 框架 | Vue.js：官方学习网址

VUES背景知识

1. 是一个JS的框架
2. 简化DOM操作
3. 响应式数据驱动

初始运用

如何导入vues

两种方式：

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

el：挂载点

el:挂载点

1. 问：Vue实例的作用范围是什么呢?
   答：Vue会管理el选项命中的元素及其内部的后代元素
2. 问：是否可以使用其他的选择器?
   答：可以使用其他的选择器,但是建议使用ID选择器
3. 问：是否可以设置其他的dom元素呢?
   答：可以使用其他的双标签,不能使用HTML和BODY

data：数据点

data:数据对象

1. Vue中用到的数据定义在data中
2. data中可以写复杂类型的数据
3. 渲染复杂类型数据时,遵守js的语法即可

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

var app = new Vue({
el:"#app"
data:
message:"黑马程序员"
array:[],
obj:{}
}
})

创建第一Vues.js程序步骤

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

案例分析与细节