【自学】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的语法即可

    {{ message }}

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

创建第一Vues.js程序步骤

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

案例分析与细节

相关推荐
前端小白从0开始32 分钟前
Vue3项目实现WPS文件预览和内容回填功能
前端·javascript·vue.js·html5·wps·文档回填·文档在线预览
難釋懷1 小时前
Vue解决开发环境 Ajax 跨域问题
前端·vue.js·ajax
挑战者6668882 小时前
vue入门环境搭建及demo运行
前端·javascript·vue.js
程序猿ZhangSir4 小时前
Vue3 项目的基本架构解读
前端·javascript·vue.js
亲亲小宝宝鸭4 小时前
写了两个小需求,终于搞清楚了表格合并
前端·vue.js
Face5 小时前
路由Vue-router 及 异步组件
前端·javascript·vue.js
风之舞_yjf6 小时前
Vue基础(14)_列表过滤、列表排序
前端·javascript·vue.js
疯狂的沙粒7 小时前
uni-app 项目支持 vue 3.0 详解及版本升级方案?
前端·vue.js·uni-app
Lhuu(重开版7 小时前
Vue:Ajax
vue.js·ajax·okhttp
国家不保护废物8 小时前
从刀耕火种到现代框架:DOM编程 vs Vue/React 进化史
前端·vue.js·react.js