Vue的学习
1.Vue是什么
参考Vue官网,一套用于构建用户界面的渐进式框架.
2.什么是渐进式框架
引用大神的话:“它给你提供足够的optional,但并不主张很多required,也不多做职责之外的事!这就是渐进式。”
3.对比
4.磨刀不误砍柴工
参考官网案例,一步步开始.
1->引入vue
官方提供的cdn,直接copy到本地。目前本地项目结构。

2->所有的入门都是走hello world 开始
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript" src="js/vue.js" ></script>
</head>
<body>
<div id='app'>{{hellow}}</div>
</body>
<script>
var app =new Vue({
el:'#app',
data:
{hellow:'Hello World'}
})
</script>
</html>
3->成功创建了第一个Vue应用
vue的判断
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript" src="js/vue.js" ></script>
</head>
<body>
<div id='app'><span v-if="see">data.see为true才能看见</span></div>
</body>
<script>
var app =new Vue({
el:'#app',
data:
{see:false}
})
</script>
</html>

通过console更改data里面的see

这样 我们就能看见我们想要的效果。
Vue的学习的更多相关文章
- vue入门学习(基础篇)
vue入门学习总结: vue的一个组件包括三部分:template.style.script. vue的数据在data中定义使用. 数据渲染指令:v-text.v-html.{{}}. 隐藏未编译的标 ...
- Vue.js学习笔记(2)vue-router
vue中vue-router的使用:
- vue.js 学习笔记3——TypeScript
目录 vue.js 学习笔记3--TypeScript 工具 基础类型 数组 元组 枚举 字面量 接口 类类型 类类型要素 函数 函数参数 this对象和类型 重载 迭代器 Symbol.iterat ...
- vue.js学习资料
vue.js学习VuejsAPI教程 https://vuejs.org.cn/guide/Vuejs自己的构建工具 http://www.jianshu.com/p/f8e21d87a572如何用v ...
- 在进行vue的学习,项目中需要引入bootstrap、jquery的步骤。
在进行vue的学习,项目中需要引入bootstrap.jquery的步骤. 一.引入jQuery 在当前项目的目录下(就是package.json),运行命令 cnpm install jquery ...
- Vue.js学习笔记:在元素 和 template 中使用 v-if 指令
f 指令 语法比较简单,直接上代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " ...
- vue.js学习之better-scroll封装的轮播图初始化失败
vue.js学习之better-scroll封装的轮播图初始化失败 问题一:slider组件初始化失败 原因:页面异步获取数据很慢,导致slider初始化之后,数据还未获取到,导致图片还未加载 解决方 ...
- vue.js学习之 跨域请求代理与axios传参
vue.js学习之 跨域请求代理与axios传参 一:跨域请求代理 1:打开config/index.js module.exports{ dev: { } } 在这里面找到proxyTable{}, ...
- vue.js学习之 打包为生产环境后,页面为白色
vue.js学习之 打包为生产环境后,页面为白色 一:配置问题 当我们将项目打包为生产环境后,在dist文件夹下打开index.html,会发现页面为白色. 1:打开config>index.j ...
- vue.js学习之 如何在手机上查看vue-cli构建的项目
vue.js学习之 如何在手机上查看vue-cli构建的项目 一:找到config文件夹下的index.js文件,打开后,将host的值改为你本地的ip,保存后重启项目 二:输入ip和端口号打开项目 ...
随机推荐
- python接口自动化-接口重定向和编码格式
1.如果测试的接口重定向,那么只需添加allow_redirects=False禁止重定向就可: 2.如果请求的结果,中文出现没有解码 \xe9\x83\xad\xe7\xbf\xa0\xe6\x99 ...
- COMP 321
COMP 321April 24, 2019Questions on this exam may refer to the textbook as well as to the manual page ...
- 制作用户登录界面(JAVA实现)
设计实现如图所示的个人信息注册.包含单选按钮.多选按钮.下拉框事件. Zuoye类: package example02; import java.awt.event.ActionEvent; imp ...
- 在ubuntu的bash中循环执行脚本,并在内存不足时重启
#!/bin/bash date ma=`grep MemAvailable /proc/meminfo | awk '{print $2}'` echo MemAvailable = $ma run ...
- zeros()和ones()和eye()
python--zeros函数和ones函数 使用numpy.zeros,numpy.ones,numpy.eye等方法可以构造特定的矩阵 >>>from numpy import ...
- BZOJ-2298|区间dp|线段树
problem a Description 一次考试共有n个人参加,第i个人说:"有ai个人分数比我高,bi个人分数比我低."问最少有几个人没有说真话(可能有相同的分数) Inpu ...
- Swagger和Postman的配置和使用
Swagger 1. 配置 pom文件添加swagger依赖,注意版本,2.8.0可以使用 <dependency> <groupId>io.springfox</gro ...
- CSRF、XSS、clickjacking、SQL 的攻击与防御
CSRF攻击 原理: 跨站请求伪造.是一种挟制用户在当前已登录的Web应用程序上执行非本意的操作的攻击方法. 网站通过cookie来实现登录功能.而cookie只要存在浏览器中,那么浏览器在访问含有这 ...
- mongodb在ubuntu下无法打开的问题
通过查询大概知道了是非正常关闭,mongod.lock的事,ubuntu的mongod.lock在/var/lib/mongodb中,删除之后即可重新打开.
- MVVM以及vue的双向绑定
原文:https://www.cnblogs.com/onepixel/p/6034307.html MVVM 是Model-View-ViewModel 的缩写,它是一种基于前端开发的架构模式,其核 ...