update

assets/js/124.d380c979.js → assets/js/124.493776ef.js

@@ -1 +1 @@
-(window.webpackJsonp=window.webpackJsonp||[]).push([[124],{453:function(t,n,s){"use strict";s.r(n);var i=s(3),r=Object(i.a)({},(function(){var t=this._self._c;return t("ContentSlotsDistributor",{attrs:{"slot-key":this.$parent.slotKey}},[t("p",[t("img",{attrs:{src:"/img/git.png",alt:"Git命令思维导图"}})])])}),[],!1,null,null,null);n.default=r.exports}}]);
+(window.webpackJsonp=window.webpackJsonp||[]).push([[124],{454:function(t,n,s){"use strict";s.r(n);var i=s(3),r=Object(i.a)({},(function(){var t=this._self._c;return t("ContentSlotsDistributor",{attrs:{"slot-key":this.$parent.slotKey}},[t("p",[t("img",{attrs:{src:"/img/git.png",alt:"Git命令思维导图"}})])])}),[],!1,null,null,null);n.default=r.exports}}]);

assets/js/154.8ab912b6.js → assets/js/154.a3acc6bf.js

@@ -1 +1 @@
-(window.webpackJsonp=window.webpackJsonp||[]).push([[154],{484:function(t,s,n){"use strict";n.r(s);var r=n(3),a=Object(r.a)({},(function(){var t=this._self._c;return t("ContentSlotsDistributor",{attrs:{"slot-key":this.$parent.slotKey}},[t("h1",{attrs:{id:"_01-高级指引"}},[t("a",{staticClass:"header-anchor",attrs:{href:"#_01-高级指引"}},[this._v("#")]),this._v(" 01.高级指引")])])}),[],!1,null,null,null);s.default=a.exports}}]);
+(window.webpackJsonp=window.webpackJsonp||[]).push([[154],{483:function(t,s,n){"use strict";n.r(s);var r=n(3),a=Object(r.a)({},(function(){var t=this._self._c;return t("ContentSlotsDistributor",{attrs:{"slot-key":this.$parent.slotKey}},[t("h1",{attrs:{id:"_01-高级指引"}},[t("a",{staticClass:"header-anchor",attrs:{href:"#_01-高级指引"}},[this._v("#")]),this._v(" 01.高级指引")])])}),[],!1,null,null,null);s.default=a.exports}}]);

assets/js/162.86431056.js → assets/js/162.cec1b9a3.js

@@ -1 +1 @@
-(window.webpackJsonp=window.webpackJsonp||[]).push([[162],{490:function(s,a,t){"use strict";t.r(a);var e=t(3),r=Object(e.a)({},(function(){var s=this,a=s._self._c;return a("ContentSlotsDistributor",{attrs:{"slot-key":s.$parent.slotKey}},[a("h1",{attrs:{id:"安装-typescript"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#安装-typescript"}},[s._v("#")]),s._v(" 安装 TypeScript")]),s._v(" "),a("p",[s._v("命令行运行如下命令，全局安装 TypeScript：")]),s._v(" "),a("div",{staticClass:"language-bash line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-bash"}},[a("code",[a("span",{pre:!0,attrs:{class:"token function"}},[s._v("npm")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("install")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token parameter variable"}},[s._v("-g")]),s._v(" typescript\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br")])]),a("p",[s._v("安装完成后，在控制台运行如下命令，检查安装是否成功(3.x)：")]),s._v(" "),a("div",{staticClass:"language-bash line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-bash"}},[a("code",[s._v("tsc "),a("span",{pre:!0,attrs:{class:"token parameter variable"}},[s._v("-V")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br")])])])}),[],!1,null,null,null);a.default=r.exports}}]);
+(window.webpackJsonp=window.webpackJsonp||[]).push([[162],{548:function(s,a,t){"use strict";t.r(a);var e=t(3),r=Object(e.a)({},(function(){var s=this,a=s._self._c;return a("ContentSlotsDistributor",{attrs:{"slot-key":s.$parent.slotKey}},[a("h1",{attrs:{id:"安装-typescript"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#安装-typescript"}},[s._v("#")]),s._v(" 安装 TypeScript")]),s._v(" "),a("p",[s._v("命令行运行如下命令，全局安装 TypeScript：")]),s._v(" "),a("div",{staticClass:"language-bash line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-bash"}},[a("code",[a("span",{pre:!0,attrs:{class:"token function"}},[s._v("npm")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("install")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token parameter variable"}},[s._v("-g")]),s._v(" typescript\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br")])]),a("p",[s._v("安装完成后，在控制台运行如下命令，检查安装是否成功(3.x)：")]),s._v(" "),a("div",{staticClass:"language-bash line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-bash"}},[a("code",[s._v("tsc "),a("span",{pre:!0,attrs:{class:"token parameter variable"}},[s._v("-V")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br")])])])}),[],!1,null,null,null);a.default=r.exports}}]);

assets/js/172.44d1d022.js → assets/js/172.b659d767.js

@@ -1 +1 @@
-(window.webpackJsonp=window.webpackJsonp||[]).push([[172],{499:function(t,e,s){"use strict";s.r(e);var a=s(3),r=Object(a.a)({},(function(){var t=this,e=t._self._c;return e("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[e("h1",{attrs:{id:"需求分析"}},[e("a",{staticClass:"header-anchor",attrs:{href:"#需求分析"}},[t._v("#")]),t._v(" 需求分析")]),t._v(" "),e("p",[t._v("接下来的章节，我们会使用 TypeScript 来重构 axios，重构之前，我们需要简单地做一些需求分析，看一下我们这次重构需要支持哪些 feature。")]),t._v(" "),e("h2",{attrs:{id:"features"}},[e("a",{staticClass:"header-anchor",attrs:{href:"#features"}},[t._v("#")]),t._v(" Features")]),t._v(" "),e("ul",[e("li",[t._v("在浏览器端使用 XMLHttpRequest 对象通讯")]),t._v(" "),e("li",[t._v("支持 Promise API")]),t._v(" "),e("li",[t._v("支持请求和响应的拦截器")]),t._v(" "),e("li",[t._v("支持请求数据和响应数据的转换")]),t._v(" "),e("li",[t._v("支持请求的取消")]),t._v(" "),e("li",[t._v("JSON 数据的自动转换")]),t._v(" "),e("li",[t._v("客户端防止 XSRF")])]),t._v(" "),e("p",[t._v("此外，我们还会支持一些 axios 库支持的一些其它的 feature。这里要注意的，我们这次重构不包括 axios 在 Node 中的实现，因为这部分我们在平时项目中应用的很少，还涉及到很多 Node.js 的知识，如果都讲的话，一是比较占用时间，另一个可能会喧宾夺主了。当然，这部分知识点我会根据同学们学习的反馈，如果大家很感兴趣想学习的话，我就作为课程的补充内容加到后期视频的扩展中，也当做课程的福利送给大家，所以大家务必要支持一下正版课程喔~")]),t._v(" "),e("p",[t._v("那么接下来我们就开始初始化项目吧！")])])}),[],!1,null,null,null);e.default=r.exports}}]);
+(window.webpackJsonp=window.webpackJsonp||[]).push([[172],{501:function(t,e,s){"use strict";s.r(e);var a=s(3),r=Object(a.a)({},(function(){var t=this,e=t._self._c;return e("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[e("h1",{attrs:{id:"需求分析"}},[e("a",{staticClass:"header-anchor",attrs:{href:"#需求分析"}},[t._v("#")]),t._v(" 需求分析")]),t._v(" "),e("p",[t._v("接下来的章节，我们会使用 TypeScript 来重构 axios，重构之前，我们需要简单地做一些需求分析，看一下我们这次重构需要支持哪些 feature。")]),t._v(" "),e("h2",{attrs:{id:"features"}},[e("a",{staticClass:"header-anchor",attrs:{href:"#features"}},[t._v("#")]),t._v(" Features")]),t._v(" "),e("ul",[e("li",[t._v("在浏览器端使用 XMLHttpRequest 对象通讯")]),t._v(" "),e("li",[t._v("支持 Promise API")]),t._v(" "),e("li",[t._v("支持请求和响应的拦截器")]),t._v(" "),e("li",[t._v("支持请求数据和响应数据的转换")]),t._v(" "),e("li",[t._v("支持请求的取消")]),t._v(" "),e("li",[t._v("JSON 数据的自动转换")]),t._v(" "),e("li",[t._v("客户端防止 XSRF")])]),t._v(" "),e("p",[t._v("此外，我们还会支持一些 axios 库支持的一些其它的 feature。这里要注意的，我们这次重构不包括 axios 在 Node 中的实现，因为这部分我们在平时项目中应用的很少，还涉及到很多 Node.js 的知识，如果都讲的话，一是比较占用时间，另一个可能会喧宾夺主了。当然，这部分知识点我会根据同学们学习的反馈，如果大家很感兴趣想学习的话，我就作为课程的补充内容加到后期视频的扩展中，也当做课程的福利送给大家，所以大家务必要支持一下正版课程喔~")]),t._v(" "),e("p",[t._v("那么接下来我们就开始初始化项目吧！")])])}),[],!1,null,null,null);e.default=r.exports}}]);

assets/js/18.f17de23a.js → assets/js/18.c338fe95.js

@@ -1 +1 @@
-(window.webpackJsonp=window.webpackJsonp||[]).push([[18],{347:function(t,s,a){"use strict";a.r(s);var e=a(3),n=Object(e.a)({},(function(){var t=this,s=t._self._c;return s("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[s("h2",{attrs:{id:"测试文件"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#测试文件"}},[t._v("#")]),t._v(" 测试文件")]),t._v(" "),s("p",[t._v("Test Test")]),t._v(" "),s("code-group",[s("code-block",{attrs:{title:"YARN",active:""}},[s("div",{staticClass:"language-bash line-numbers-mode"},[s("pre",{pre:!0,attrs:{class:"language-bash"}},[s("code",[s("span",{pre:!0,attrs:{class:"token function"}},[t._v("yarn")]),t._v(" create vuepress-site "),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("[")]),t._v("optionalDirectoryName"),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("]")]),t._v("\n"),s("span",{pre:!0,attrs:{class:"token comment"}},[t._v("# OR npx create-vuepress-site [optionalDirectoryName]")]),t._v("\n")])]),t._v(" "),s("div",{staticClass:"line-numbers-wrapper"},[s("span",{staticClass:"line-number"},[t._v("1")]),s("br"),s("span",{staticClass:"line-number"},[t._v("2")]),s("br")])])]),t._v(" "),s("code-block",{attrs:{title:"NPM"}},[s("div",{staticClass:"language-bash line-numbers-mode"},[s("pre",{pre:!0,attrs:{class:"language-bash"}},[s("code",[t._v("npx create-vuepress-site "),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("[")]),t._v("optionalDirectoryName"),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("]")]),t._v("\n")])]),t._v(" "),s("div",{staticClass:"line-numbers-wrapper"},[s("span",{staticClass:"line-number"},[t._v("1")]),s("br")])])])],1)],1)}),[],!1,null,null,null);s.default=n.exports}}]);
+(window.webpackJsonp=window.webpackJsonp||[]).push([[18],{346:function(t,s,a){"use strict";a.r(s);var e=a(3),n=Object(e.a)({},(function(){var t=this,s=t._self._c;return s("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[s("h2",{attrs:{id:"测试文件"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#测试文件"}},[t._v("#")]),t._v(" 测试文件")]),t._v(" "),s("p",[t._v("Test Test")]),t._v(" "),s("code-group",[s("code-block",{attrs:{title:"YARN",active:""}},[s("div",{staticClass:"language-bash line-numbers-mode"},[s("pre",{pre:!0,attrs:{class:"language-bash"}},[s("code",[s("span",{pre:!0,attrs:{class:"token function"}},[t._v("yarn")]),t._v(" create vuepress-site "),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("[")]),t._v("optionalDirectoryName"),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("]")]),t._v("\n"),s("span",{pre:!0,attrs:{class:"token comment"}},[t._v("# OR npx create-vuepress-site [optionalDirectoryName]")]),t._v("\n")])]),t._v(" "),s("div",{staticClass:"line-numbers-wrapper"},[s("span",{staticClass:"line-number"},[t._v("1")]),s("br"),s("span",{staticClass:"line-number"},[t._v("2")]),s("br")])])]),t._v(" "),s("code-block",{attrs:{title:"NPM"}},[s("div",{staticClass:"language-bash line-numbers-mode"},[s("pre",{pre:!0,attrs:{class:"language-bash"}},[s("code",[t._v("npx create-vuepress-site "),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("[")]),t._v("optionalDirectoryName"),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("]")]),t._v("\n")])]),t._v(" "),s("div",{staticClass:"line-numbers-wrapper"},[s("span",{staticClass:"line-number"},[t._v("1")]),s("br")])])])],1)],1)}),[],!1,null,null,null);s.default=n.exports}}]);

assets/js/211.de944cbe.js → assets/js/211.0f8a9304.js

@@ -1 +1 @@
-(window.webpackJsonp=window.webpackJsonp||[]).push([[211],{541:function(t,e,s){"use strict";s.r(e);var v=s(3),o=Object(v.a)({},(function(){var t=this,e=t._self._c;return e("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[e("div",{staticClass:"custom-block tip"},[e("p",{staticClass:"custom-block-title"},[t._v("提示")]),t._v(" "),e("p",[t._v("说明：本章内容是博主的Vue学习笔记，以"),e("a",{attrs:{href:"https://cn.vuejs.org/v2/guide/",target:"_blank",rel:"noopener noreferrer"}},[t._v("官方文档"),e("OutboundLink")],1),t._v("为准。")])]),t._v(" "),e("h1",{attrs:{id:"mvvm模式"}},[e("a",{staticClass:"header-anchor",attrs:{href:"#mvvm模式"}},[t._v("#")]),t._v(" MVVM模式")]),t._v(" "),e("p",[t._v("MVVM模式，"),e("code",[t._v("M")]),t._v("即 model，数据模型；"),e("code",[t._v("V")]),t._v("即 view，视图；"),e("code",[t._v("VM")]),t._v("即 view-model，视图模型。\n"),t._v(" "),e("img",{attrs:{src:"https://cdn.jsdelivr.net/gh/xugaoyi/image_store/blog/20200204123438.png",alt:""}})]),t._v(" "),e("p",[e("strong",[t._v("理解")])]),t._v(" "),e("p",[t._v("首先，数据Model通过Data Bindings把数据绑定在View视图上，")]),t._v(" "),e("p",[t._v("当View视图有交互（有改变）的时候，Dom listeners会自动监听，然后更新数据Model。")]),t._v(" "),e("p",[e("strong",[t._v("Q：什么是MVVM模式？")])]),t._v(" "),e("p",[t._v("A：MVVM模式，第一个M代表数据模型，V代表视图，VM代表视图模型；\n它的实际操作原理是：后台数据通过视图模型来渲染视图，就是页面。当用户在页面上进行操作的时候，\n视图模型会自动监听到用户的操作，从而改变后台数据。")])])}),[],!1,null,null,null);e.default=o.exports}}]);
+(window.webpackJsonp=window.webpackJsonp||[]).push([[211],{540:function(t,e,s){"use strict";s.r(e);var v=s(3),o=Object(v.a)({},(function(){var t=this,e=t._self._c;return e("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[e("div",{staticClass:"custom-block tip"},[e("p",{staticClass:"custom-block-title"},[t._v("提示")]),t._v(" "),e("p",[t._v("说明：本章内容是博主的Vue学习笔记，以"),e("a",{attrs:{href:"https://cn.vuejs.org/v2/guide/",target:"_blank",rel:"noopener noreferrer"}},[t._v("官方文档"),e("OutboundLink")],1),t._v("为准。")])]),t._v(" "),e("h1",{attrs:{id:"mvvm模式"}},[e("a",{staticClass:"header-anchor",attrs:{href:"#mvvm模式"}},[t._v("#")]),t._v(" MVVM模式")]),t._v(" "),e("p",[t._v("MVVM模式，"),e("code",[t._v("M")]),t._v("即 model，数据模型；"),e("code",[t._v("V")]),t._v("即 view，视图；"),e("code",[t._v("VM")]),t._v("即 view-model，视图模型。\n"),t._v(" "),e("img",{attrs:{src:"https://cdn.jsdelivr.net/gh/xugaoyi/image_store/blog/20200204123438.png",alt:""}})]),t._v(" "),e("p",[e("strong",[t._v("理解")])]),t._v(" "),e("p",[t._v("首先，数据Model通过Data Bindings把数据绑定在View视图上，")]),t._v(" "),e("p",[t._v("当View视图有交互（有改变）的时候，Dom listeners会自动监听，然后更新数据Model。")]),t._v(" "),e("p",[e("strong",[t._v("Q：什么是MVVM模式？")])]),t._v(" "),e("p",[t._v("A：MVVM模式，第一个M代表数据模型，V代表视图，VM代表视图模型；\n它的实际操作原理是：后台数据通过视图模型来渲染视图，就是页面。当用户在页面上进行操作的时候，\n视图模型会自动监听到用户的操作，从而改变后台数据。")])])}),[],!1,null,null,null);e.default=o.exports}}]);

assets/js/213.503671a6.js → assets/js/213.89521ebd.js

@@ -1 +1 @@
-(window.webpackJsonp=window.webpackJsonp||[]).push([[213],{543:function(t,v,e){"use strict";e.r(v);var s=e(3),r=Object(s.a)({},(function(){var t=this,v=t._self._c;return v("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[v("h1",{attrs:{id:"计算属性-vs-方法-vs-侦听属性"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#计算属性-vs-方法-vs-侦听属性"}},[t._v("#")]),t._v(" 计算属性 vs 方法 vs 侦听属性")]),t._v(" "),v("p",[v("a",{attrs:{href:"https://cn.vuejs.org/v2/guide/computed.html#%E8%AE%A1%E7%AE%97%E5%B1%9E%E6%80%A7%E7%BC%93%E5%AD%98-vs-%E6%96%B9%E6%B3%95",target:"_blank",rel:"noopener noreferrer"}},[t._v("API"),v("OutboundLink")],1)]),t._v(" "),v("p",[t._v("如果一个功能同时可以使用计算属性(computed)、方法(methods)、侦听属性(watch)来实现的时候推荐使用计算属性。\n")]),t._v(" "),v("table",[v("thead",[v("tr",[v("th",[t._v("计算属性")]),t._v(" "),v("th",[t._v("方法")]),t._v(" "),v("th",[t._v("侦听属性")])])]),t._v(" "),v("tbody",[v("tr",[v("td",[t._v("计算属性是基于它们的响应式依赖进行缓存的")]),t._v(" "),v("td",[t._v("每当触发重新渲染时，调用方法将"),v("strong",[t._v("总会")]),t._v("再次执行函数")]),t._v(" "),v("td",[t._v("有缓存，但相比计算属性，实现起来要复杂很多。")])])])])])}),[],!1,null,null,null);v.default=r.exports}}]);
+(window.webpackJsonp=window.webpackJsonp||[]).push([[213],{542:function(t,v,e){"use strict";e.r(v);var s=e(3),r=Object(s.a)({},(function(){var t=this,v=t._self._c;return v("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[v("h1",{attrs:{id:"计算属性-vs-方法-vs-侦听属性"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#计算属性-vs-方法-vs-侦听属性"}},[t._v("#")]),t._v(" 计算属性 vs 方法 vs 侦听属性")]),t._v(" "),v("p",[v("a",{attrs:{href:"https://cn.vuejs.org/v2/guide/computed.html#%E8%AE%A1%E7%AE%97%E5%B1%9E%E6%80%A7%E7%BC%93%E5%AD%98-vs-%E6%96%B9%E6%B3%95",target:"_blank",rel:"noopener noreferrer"}},[t._v("API"),v("OutboundLink")],1)]),t._v(" "),v("p",[t._v("如果一个功能同时可以使用计算属性(computed)、方法(methods)、侦听属性(watch)来实现的时候推荐使用计算属性。\n")]),t._v(" "),v("table",[v("thead",[v("tr",[v("th",[t._v("计算属性")]),t._v(" "),v("th",[t._v("方法")]),t._v(" "),v("th",[t._v("侦听属性")])])]),t._v(" "),v("tbody",[v("tr",[v("td",[t._v("计算属性是基于它们的响应式依赖进行缓存的")]),t._v(" "),v("td",[t._v("每当触发重新渲染时，调用方法将"),v("strong",[t._v("总会")]),t._v("再次执行函数")]),t._v(" "),v("td",[t._v("有缓存，但相比计算属性，实现起来要复杂很多。")])])])])])}),[],!1,null,null,null);v.default=r.exports}}]);

assets/js/214.2be447ed.js → assets/js/214.cd5ec468.js

@@ -1 +1 @@
-(window.webpackJsonp=window.webpackJsonp||[]).push([[214],{544:function(t,v,s){"use strict";s.r(v);var o=s(3),e=Object(o.a)({},(function(){var t=this,v=t._self._c;return v("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[v("h1",{attrs:{id:"v-if-vs-v-show"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#v-if-vs-v-show"}},[t._v("#")]),t._v(" v-if vs v-show")]),t._v(" "),v("p",[v("a",{attrs:{href:"https://cn.vuejs.org/v2/guide/conditional.html#v-if-vs-v-show",target:"_blank",rel:"noopener noreferrer"}},[t._v("API"),v("OutboundLink")],1)]),t._v(" "),v("p",[v("code",[t._v("v-if")]),t._v(" 根据渲染条件决定是否把元素渲染到DOM页面，而"),v("code",[t._v("v-show")]),t._v("不管渲染条件是什么，都会把元素渲染到DOM页面，只是简单的切换CSS的显示隐藏。\n"),t._v("\n如果需要非常频繁地切换，则使用 "),v("code",[t._v("v-show")]),t._v(" 较好；如果在运行时条件很少改变，则使用 "),v("code",[t._v("v-if")]),t._v(" 较好。")])])}),[],!1,null,null,null);v.default=e.exports}}]);
+(window.webpackJsonp=window.webpackJsonp||[]).push([[214],{543:function(t,v,s){"use strict";s.r(v);var o=s(3),e=Object(o.a)({},(function(){var t=this,v=t._self._c;return v("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[v("h1",{attrs:{id:"v-if-vs-v-show"}},[v("a",{staticClass:"header-anchor",attrs:{href:"#v-if-vs-v-show"}},[t._v("#")]),t._v(" v-if vs v-show")]),t._v(" "),v("p",[v("a",{attrs:{href:"https://cn.vuejs.org/v2/guide/conditional.html#v-if-vs-v-show",target:"_blank",rel:"noopener noreferrer"}},[t._v("API"),v("OutboundLink")],1)]),t._v(" "),v("p",[v("code",[t._v("v-if")]),t._v(" 根据渲染条件决定是否把元素渲染到DOM页面，而"),v("code",[t._v("v-show")]),t._v("不管渲染条件是什么，都会把元素渲染到DOM页面，只是简单的切换CSS的显示隐藏。\n"),t._v("\n如果需要非常频繁地切换，则使用 "),v("code",[t._v("v-show")]),t._v(" 较好；如果在运行时条件很少改变，则使用 "),v("code",[t._v("v-if")]),t._v(" 较好。")])])}),[],!1,null,null,null);v.default=e.exports}}]);