Vue.js学习笔记（二）
Vue.js不支持IE8及以下的版本，因为vue使用了IE8无法模拟的ECMAScript5的特性，它支持所有兼容ECMAScript5的浏览器。
<!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>Hello World</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head> <body>
<div id="app">{{content}}</div>
<script>
//原生js实现hello world
// var dom = document.getElementById("app");
// dom.innerHTML = 'Hello World!';
// setTimeout(function() {
// dom.innerHTML = 'bye world'
// }, 2000); //vue实现hello world
//使用vue之后不需要关注任何dom的操作，只需把精力集中到数据的管理之上，
//数据放的是什么，页面展示的就是什么，数据改变了，页面就会跟着改变
var app = new Vue({
el: '#app', //限制了一个vue实例处理的DOM范围
data: {
content: 'Hello World!' //data用于定义一些数据
}
});
setTimeout(function() {
app.$data.content = 'bye world' //两秒之后content内容变成bye world
}, 2000)
</script>
</body> </html>
Vue.js学习笔记（二）的更多相关文章
- vue.js学习笔记(二)——vue-router详解
vue-router详解 原文链接:www.jianshu.com 一.前言 要学习vue-router就要先知道这里的路由是什么?为什么我们不能像原来一样直接用<a></a> ...
- vue.js学习笔记(二)：如何加载本地json文件
在项目开发的过程中,因为无法和后台的数据做交互,所以我们可以自建一个假数据文件(如data.json)到项目文件夹中,这样我们就可以模仿后台的数据进行开发.但是,如何在一个vue.js 项目中引入本地 ...
- Vue.js学习笔记（2）vue-router
vue中vue-router的使用:
- vue.js 学习笔记3——TypeScript
目录 vue.js 学习笔记3--TypeScript 工具 基础类型 数组 元组 枚举 字面量 接口 类类型 类类型要素 函数 函数参数 this对象和类型 重载 迭代器 Symbol.iterat ...
- Vue.js学习笔记：在元素 和 template 中使用 v-if 指令
f 指令 语法比较简单,直接上代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " ...
- Vue.js 学习笔记之二：数据驱动开发
在 Vue.js 框架中,与 HTML 页面元素的交互方式没有像原生 JavaScript 接口那么直接,它是通过先在 HTML 元素标签中嵌入一系列类似于普通标签属性的 Vue 指令属性来绑定数据, ...
- Vue.js 学习笔记 一
本文的Demo和源代码已放到GitHub,如果您觉得本篇内容不错,请点个赞,或在GitHub上加个星星! https://github.com/zwl-jasmine95/Vue_test 以下所有知 ...
- Vue.js学习笔记（一） - 起步
本篇将简单介绍一下Vue.js,并在Node.js环境下搭建一个简单的Demo. 一.简介 我个人理解,Vue.js是一套前端视图层的框架,它只关心视图展示和数据绑定,它的一些语法与Angular 1 ...
- Vue.js 学习笔记 第7章 组件详解
本篇目录: 7.1 组件与复用 7.2 使用props传递数据 7.3 组件通讯 7.4 使用slot分发内容 7.5 组件高级用法 7.6 其他 7.7 实战:两个常用组件的开发 组件(Compon ...
随机推荐
- 新手学ajax2
今天主要解决了一个困扰两天的ajax问题,就是关于从服务器获取数据时的同步和异步问题 , xhr.open("GET", url,false): 这里有三个参数“GET”表示获取的 ...
- Django Model基础操作
关于设计django model django为我们集成了ORM对数据库进行操作,我们只需要进行定义model,django就会自动为我们创建表,以及表之间的关联关系 创建好一个django项目-首先 ...
- Beta阶段——3
一.提供当天站立式会议照片一张: 二. 每个人的工作 (有work item 的ID) (1) 昨天已完成的工作: 今天主要是对管理员功能进行改进,解决了Alpha阶段出现的一些问题 (2) 今天计划 ...
- beta发布简评
第一组:新蜂小组 题目:俄罗斯方块 评论:主体功能已经完成,可以流畅的进行游戏,无论效果或是功能都实现的很好. 第二组:Nice团队 题目:约跑APP(约吧) 评论:作为应用,想法创意很好:功能实现上 ...
- 如何提高cxgrid的刷新速度
如果View的类型是cxGridDBTableView: 1.cxGrid.DisableControls;cxGrid.EnableControls; 如仍觉得慢,可以把 cxGrid1DBTabl ...
- MYSQL中可以实现类似IF判断的方法
MYSQL中可以实现类似IF判断的方法 新建一张客户表,如下:sex:1-男,2-女,3-未知:level是客户的级别:1-超级VIP客户,2-VIP客户,3-普通客户 方式一:case函数:流程控制 ...
- Best Time to Buy and Sell Stock IV
Say you have an array for which the ith element is the price of a given stock on day i. Design an al ...
- css中定位功能的特性
它有四大特性,页面找不到盒子的情况 1.z-index值表示谁压着谁,数值大的压盖数值小的 2.只有定位了的元素,才有z-index.也就是说,不管相对定位,绝对定位,固定定位,都可以使用z-inde ...
- codeforces 1041 E.Vasya and Good Sequences(暴力？)
E. Vasya and Good Sequences time limit per test 2 seconds memory limit per test 256 megabytes input ...
- List、Set、Map
List:1.可以允许重复的对象. 2.可以插入多个null元素. 3.是一个有序容器,保持了每个元素的插入顺序,输出的顺序就是插入的顺序. 4.常用的实现类有 ArrayList.LinkedLi ...