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的学习的更多相关文章

  1. vue入门学习(基础篇)

    vue入门学习总结: vue的一个组件包括三部分:template.style.script. vue的数据在data中定义使用. 数据渲染指令:v-text.v-html.{{}}. 隐藏未编译的标 ...

  2. Vue.js学习笔记(2)vue-router

    vue中vue-router的使用:

  3. vue.js 学习笔记3——TypeScript

    目录 vue.js 学习笔记3--TypeScript 工具 基础类型 数组 元组 枚举 字面量 接口 类类型 类类型要素 函数 函数参数 this对象和类型 重载 迭代器 Symbol.iterat ...

  4. vue.js学习资料

    vue.js学习VuejsAPI教程 https://vuejs.org.cn/guide/Vuejs自己的构建工具 http://www.jianshu.com/p/f8e21d87a572如何用v ...

  5. 在进行vue的学习,项目中需要引入bootstrap、jquery的步骤。

    在进行vue的学习,项目中需要引入bootstrap.jquery的步骤. 一.引入jQuery 在当前项目的目录下(就是package.json),运行命令 cnpm install jquery ...

  6. Vue.js学习笔记:在元素 和 template 中使用 v-if 指令

    f 指令 语法比较简单,直接上代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " ...

  7. vue.js学习之better-scroll封装的轮播图初始化失败

    vue.js学习之better-scroll封装的轮播图初始化失败 问题一:slider组件初始化失败 原因:页面异步获取数据很慢,导致slider初始化之后,数据还未获取到,导致图片还未加载 解决方 ...

  8. vue.js学习之 跨域请求代理与axios传参

    vue.js学习之 跨域请求代理与axios传参 一:跨域请求代理 1:打开config/index.js module.exports{ dev: { } } 在这里面找到proxyTable{}, ...

  9. vue.js学习之 打包为生产环境后,页面为白色

    vue.js学习之 打包为生产环境后,页面为白色 一:配置问题 当我们将项目打包为生产环境后,在dist文件夹下打开index.html,会发现页面为白色. 1:打开config>index.j ...

  10. vue.js学习之 如何在手机上查看vue-cli构建的项目

    vue.js学习之 如何在手机上查看vue-cli构建的项目 一:找到config文件夹下的index.js文件,打开后,将host的值改为你本地的ip,保存后重启项目 二:输入ip和端口号打开项目 ...

随机推荐

  1. html5中视频播放问题总结

    html5中视频播放问题总结 文章 1.问题一 框架? 加个标签就OK! <video id="video1" src="/video1.mp4" con ...

  2. sourceTree 代码冲突解决

    1.代码提交,有冲突 2. 拉取未同步的代码,勾选用衍合代替合并. 3. 在工作副本,未提交代码显示 4. 冲突代码解决 5. sourcetree页面

  3. for 循环,如果判断那里用到了一个函数,每次循环一次都会调用一次函数,如图

    但用高级for,可以不用每次都调用方法

  4. 比较两个Date类型的数据相差几年

    package com.utils; import java.text.DecimalFormat; import java.text.ParseException; import java.text ...

  5. Vue 组件&组件之间的通信 之 非父子关系组件之间的通信

    Vue中不同的组件,即使不存在父子关系也可以相互通信,我们称为非父子关系通信: 我们需要借助一个空Vue实例,在不同的组件中,使用相同的Vue实例来发送/监听事件,达到数据通信的目的: 实例: 初始加 ...

  6. shell 构建脚本基础

    bash -v test.sh 启用 verbose 调试模式 bash -n test.sh  启用语法检查调试模式 bash -x test.sh  遍历脚本执行过程 一.基础参数 1.shell ...

  7. [c/c++] programming之路(30)、位运算(一)

    一.取反 ~ #include<stdio.h> #include<stdlib.h> void main(){ unsigned ; //0000 1111 char的单位是 ...

  8. Bigger-Mai 养成计划,前端基础学习之HTML

    HTML 超文本标记语言(Hyper Text Markup Language) 1.一套规则,浏览器认识的规则. 2.开发者: 学习Html规则 开发后台程序: - 写Html文件(充当模板的作用) ...

  9. 关于js中的类式继承

    ; }; ,,]; }; ); ; }; //子类 function Bb(){ }; var F=new f(); F.prototype=Aa.prototype;//此处只能传递方法,没有办法传 ...

  10. Lintcode155-Minimum Depth of Binary Tree-Easy

    155. Minimum Depth of Binary Tree Given a binary tree, find its minimum depth. The minimum depth is ...