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 ...
随机推荐
- 《Spring2之站立会议1》
<Spring2之站立会议1> 昨天,查找了关于建立起服务器和客户端两端的连接的资料,并学习了如何写把两者建立起来的代码: 今天,模仿着相关资料,分别写了客户端和服务器两端的代码: 遇到的 ...
- 手机连接wifi 访问本地服务器网站
手机连本地wifi后访问 http://192.168.155.1:8001/loc 版权声明:本文为博主原创文章,未经博主允许不得转载.
- 【CS231N】6、神经网络动态部分:损失函数等
一.疑问 二.知识点 1. 损失函数可视化 损失函数一般都是定义在高维度的空间中,这样要将其可视化就很困难.然而办法还是有的,在1个维度或者2个维度的方向上对高维空间进行切片,例如,随机生成一个权 ...
- Java 线程结束 & 守护线程
/* 停止线程: 1,stop方法. 2,run方法结束. 怎么控制线程的任务结束呢? 任务中都会有循环结构,只要控制住循环就可以结束任务. 控制循环通常就用定义标记来完成. 但是如果线程处于了冻结状 ...
- 记:ASP.NET Core开发时部署到IIS上出现HTTP Error 502.5 - Process Failure的解决方案
HTTP Error 502.5 - Process Failure Common causes of this issue: The application process failed to st ...
- 手动解析Excel获取文件元数据
工作中有遇到需要获取上传的Excel文件的列明.最大行数.大小等元数据信息.通常做法是通过Apache的POI工具加载文件然后再读取行列进行处理.这种方法很大的弊端就是需要把excel文件加载到内存, ...
- Envoy如何打败Linkerd成为L7负载平衡器的最佳选择?
本文转自:http://www.servicemesh.cn/?/article/41 作者:MIKE WHITE 翻译:姚炳雄 原文:Using Envoy to Load Balance gRPC ...
- 关于对JSON.parse()与JSON.stringify()的理解
JSON.parse()与JSON.stringify()的区别 JSON.parse()[从一个字符串中解析出json对象] 例子: //定义一个字符串 var data='{"nam ...
- wamp 开启短标签支持
1.先使用phpinfo.php文件打印出信息 2.找到Loaded Configuration File 根据他的路径去修改php.ini文件 3.打开php.ini文件,搜索 short_op ...
- Mysql高并发情况下的解决方案(转)
查询了下Mysql 关于高并发的处理的资料,在这记录一下. 高并发大多的瓶颈在后台数据逻辑处理,在存储,mysql的正常的优化方案如下: 1.代码中sql语句优化 2.数据库字段优化,索引优化 3.加 ...