VUE快速入门 第一章：Vue基础

                                       

                                                 VUE快速入门

                                                                                                   Vue quick start

 

学前基础

HTML

CSS

JavaScript

AJAX

开发工具

VS Code +Live Servier插件（代码保存，浏览器自动刷新）

课程安排

Vue基础、本地应用、网络应用、综合应用

第一章：Vue基础

Vue基础-简介

1. JavaScript框架

2. 简化Dom操作

3. 响应式数据驱动

Vue基础-第一个Vue程序

Vue作者尤雨溪  官方文档：https://cn.vuejs.org

第一个Vue程序：官方文档----起步

{{ message }}

你好 小黑!

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

 

导包：

或者：

 

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

Vue基础-el挂载点

Vue实例的作用范围是什么？

       Vue会管理el选项命中的元素及其内部的后代元素。

 

是否可以使用其他选择器？

       可以使用，但建议使用ID选择器，#。

 

是否可以设置其他dom元素？

可以说hi用其他双标签，但不能使用TML和BODYy

Vue基础-data数据对象

Vue中用到的数据定义在data中

Data中可以写复杂类型的数据，如对象、数组等

渲染/调用复杂类型数据时，遵循js的语法即可

{{ message }}         {{ school.name }} {{ school.mobile }}                      {{ campus[0] }}             {{ campus[3] }}

 

视频：https://www.bilibili.com/video/BV12J411m7MG?from=search&seid=488807520486206024

笔记：https://gitee.com/ikunsdc/vue-quick-start/blob/master/VUE%E5%BF%AB%E9%80%9F%E5%85%A5%E9%97%A8.pdf

代码：https://gitee.com/ikunsdc/vue-quick-start