我去热饭的博客

本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开链接，会打开在线编辑器。并发请求-axios我们上一节课已经学习过如何发送get/post请求。本节课来进阶学习如何并发请求，是的没错，前端也可以并发请求注意看下面的例子，演示了如何同时并发俩个请求，在返回值处理中，分别用acct

    本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开链接，会打开在线编辑器。发送请求axios学习了这么多vue知识，我们其实已经可以用vue做很多事了，但是还有一个重要的事情，我们忘记说了，就是如何用vue发送http请求。其实发送一

本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开链接，会打开在线编辑器。Prop让我们先来看下菜鸟教程的官方定义：prop 是子组件用来接受父组件传递过来的数据的一个自定义属性。父组件的数据需要通过 props 把数据传给子组件，子组件需要显式地用 props 选项声明 "pro

本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开链接，会打开在线编辑器。组件 Component提到组件，估计大家都大概知道是什么意思，就是一个能复用的模块。那么在前端的vue里，这个组件是什么意思呢？其实就是像一个小工厂一样，源源不断的生产出来指定的元素标签，让你插入到页面上。

    本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开链接，会打开在线编辑器。按键事件我们之前学习的事点击事件，也就是v-on:click本节课我们要学的事键盘按键事件，也就是v-on:keyup之前说的click，因为我们什么都可以点击

本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开链接，会打开在线编辑器。v-model原生的表单大家应该都见过，这个form标签内有很多输入。<form>  </form>那么vue能不能让表单的数据跟着改动呢？当然可以，我们之前学习

本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开链接，会打开在线编辑器。事件修饰符上节课我们学习了事件处理器：v-on:本节课我们学习的就是在这基础上，增加一些修饰的技术。具体写法就是：v-on:属性名字.修饰符 = .stop 阻止冒泡用click点击事件

    本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开链接，会打开在线编辑器。样式绑定 ：style上节课我们讲了class样式的各种绑定用法，本节我们来学习style的用法吧。众所周知，class是调用全局样式集合的，而style则是写

本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开链接，会打开在线编辑器。事件处理器 v-on我们之前说过，v-on是一个可以带参数的指令，不过这样的说法貌似很多同学都觉得别扭，实际上，我们说给一些特殊的属性前面加v-on ，更加便于理解。比如click。写法举例：<butt

本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开链接，会打开在线编辑器。计算属性：computed大家一看这个标题：计算属性 是什么意思？不懂。computed是什么？怎么用，放在哪？也不懂。没关系，我第一次学习到这的时候 也不懂。所以我这里简单用土话给新人说一下，我们前面学习过

本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开链接，会打开在线编辑器。样式绑定 ：class我们先来思考下这个”样式绑定“是什么意思？样式：元素的样式外观，涉及到的俩个元素标签内的属性是：class 和 style绑定：vue牛逼不就牛逼在绑定上么，之前我们学习的都是绑定具体的

本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开链接，会打开在线编辑器。v-for看这个循环，大家如果熟悉python的估计都能猜出怎么用的大概。那么它是循环什么的？其实是循环元素标签的，让你的元素标签循环生成并展示。举个例子，你有5个人，想在前端展示5个人的名字。那么你要不用v

本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开链接，会打开在线编辑器。v-showv-show指令和v-if指令的作用一样，都是跟后面的表达式真假来决定元素标签是否展示的。比如：<h1 v-show="ok">Hello!</h1>看到了这，

本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开链接，会打开在线编辑器。v-ifv-if 指令，大家一看，很明显是vue自创的。是不是还有点印象？没错，我们之前讲过这个v-if了，就是在刚刚学指令的时候用v-if举例，它的作用是决定这个元素标签是否要显示出来。不过我们当时的判断很

本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开，即可打开在线编辑器。v-on监听 和 methods函数仓库v-on指令，我们一般用在按钮标签上，也就是button等。可以对用户的点击等操作 进行反馈。那么它绑定的是什么呢？当然可以是 函数了！比如：v-on:click="re

本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开链接，即可打开在线编辑器。过滤器vue的新知识点，过滤器，这个过滤器是要过滤谁？其实就是某个变量而已。但是这里我觉得叫过滤器并不准确，因为它能做的事情太多了，叫修改器还差不多。比如我要显示一个变量message<p>{{

    本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开链接，即可打开在线编辑器。缩写本节课没什么主要知识点，也不需要你必须去在草纸上测试。主要就了解下即可。因为某些指令用的太频繁，所以作者设计了简写，可以极大的加快写作速度。但是我们要背熟

本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开，即可打开在线编辑器。用户输入的双向绑定什么叫双向绑定？我们之前已经学习过，属性绑定后，vue构造器中data的变量变化是会引起dom层中元素标签的属性值变化的，而且实时刷新。那么双向绑定额意思，很显然就是说，如果标签内的属性值发生

本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开，即可打开在线编辑器。指令带参数大家一定不陌生v-bind，我们上一节课 说 ，v-开头的都是 vue自己做的一些指令，讲了一个v-if指令，用来控制元素标签是否显示隐藏。但是这个v-bind，也是一个指令。我们一开始认识它的时候，

本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开链接，即可打开在线编辑器。指令 v-问：这东西是干嘛的？答：这东西是vue自己加的特殊的一种元素属性。可以监控自己的值是否变化 来决定一些特殊事件。问：这东西怎么用？答：跟元素的其他属性如 id,name 等一样，都写在标签内即可。

本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习第四节课吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文”在新窗口中打开链接，即可打开在线编辑器表达式这个表达式又是什么？其实这里说的是 js的表达式。翻译成土话就是，js代码，也就是说，vue里面，我们一样可以写js代码。怎么样，我说应该先学js吧？不学的话很多基础的计算都没法搞了。那么在哪写

本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习第三节课吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：右键左下角“阅读原文” 在新窗口中打开链接。即可同时打开在线编辑器属性绑定什么叫属性绑定？我们分开来解读属性：一个元素标签内，可以写很多东西，比如id,name,style,click等等。但是这些并不都叫属性，比如onclick就不算属性。而id,name就

本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习第二节课吧，体验一把又土又油腻的教程吧~别忘了先打开我们的菜鸟编辑器当做草纸吧：在线菜鸟编辑器html插入看这个知识点的名字，html插入。我第一次看到的时候就有点懵，这是要插入到哪，为什么插入，等等疑惑瞬间上线。然后看了看示范代码就明白了，这是说你可以用vue 往一个元素标签内插入其他元素标签。具体操作：当做母体的标签 要你去手写一个属

    是不是觉得网上教程晦涩难懂？是不是对这个vue没有概念？是不是不知道怎么更简单的用起来？本公众号 的系列文章《跟热饭一起学习vue吧》，本文会采用非常土，非常low的语言，让读者学习并立即上手即可使用vue去写前端页面。简单生动，由浅入深。那么，就一起开始学习吧，体验一把又土又油腻的教程吧~1.什么是vue，为什么要学习？答：写前端用的，完成各种各样的交互，挺流行的，别人都用，我也要用！找工作也好找！2.vue难不难？答：什么技术都是难者不会，会者不难！只要勤