![](https://img-blog.csdnimg.cn/20201014180756923.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue.js
文章平均质量分 82
Vue.js 学习笔记
wkxjhngw
这个作者很懒,什么都没留下…
展开
-
Webpack知识体系 | 青训营笔记
什么是 Webpack;Webpack打包核心流程;使用webpack原创 2022-08-11 21:59:23 · 55 阅读 · 0 评论 -
Webpack-Plugin | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第四届青训营 」笔记创作活动的的第10天认识Pluginplugin是什么?plugin是插件的意思,通常是用于对某个现有的架构进行扩展。webpack中的插件,就是对webpack现有功能的各种扩展,比如打包优化,文件压缩等等。loader和plugin区...原创 2022-08-13 23:18:27 · 52 阅读 · 0 评论 -
Webpack-搭建本地服务器 | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第四届青训营 」笔记创作活动的的第11天搭建本地服务器webpack提供了一个可选的本地开发服务器,这个本地服务器基于node.js搭建,内部使用express框架,可以实现我们想要的让浏览器自动刷新显示我们修改后的结果。不过它是一个单独的模块,在webpac...原创 2022-08-14 22:16:33 · 40 阅读 · 0 评论 -
Webpack配置Vue | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第四届青训营 」笔记创作活动的的第9天在webpack环境中集成Vuejs希望在项目中使用Vuejs,必然需要对其有依赖,所以需要先进行安装注:因为我们后续是在实际项目中也会使用vue的,所以并不是开发时依赖 没有-dev npm install vue@2.5.21...原创 2022-08-12 22:56:42 · 38 阅读 · 0 评论 -
Vue组件化-1 | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第四届青训营 」笔记创作活动的的第4天什么是组件化 人面对复杂问题的处理方式: 任何一个人处理信息的逻辑能力都是有限的 所以,当面对一个非常复杂的问题时,我们不太可能一次性搞定一大堆的内容。 但是,我们人有一种天生的能力,就是将问题进行拆解。 ...原创 2022-08-07 19:44:58 · 46 阅读 · 0 评论 -
Vue组件化-2-父子组件 | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第四届青训营 」笔记创作活动的的第5天父子组件通信子组件是不能引用父组件或者ue实例的数据的。但是,在开发中,往往一些数据确实需要从上层传递到下层︰ 比如在一个页面中,我们从服务器请求到了很多的数据。 其中一部分数据,并非是我们整个页面的大组件来展示的,而是...原创 2022-08-08 18:30:49 · 53 阅读 · 0 评论 -
Vue组件化-3-slot 插槽 | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第四届青训营 」笔记创作活动的的第6天slot-插槽为什么使用插槽slot翻译为插槽: 在生活中很多地方都有插槽,电脑的USB插槽,插板当中的电源插槽。 插槽的目的是让我们原来的设备具备更多的扩展性。 比如电脑的USB我们可以插入U盘、硬盘、手机、音...原创 2022-08-09 12:45:41 · 67 阅读 · 0 评论 -
Vue CLI | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第四届青训营 」笔记创作活动的的第16天什么是Vue CLI如果你只是简单写几个Vue的Demo程序, 那么你不需要Vue CLI.如果你在开发大型项目, 那么你需要, 并且必然需要使用Vue CLI使用Vue.js开发大型应用时,我们需要考虑代码目录结构、项目...原创 2022-08-19 23:12:02 · 48 阅读 · 0 评论 -
v-on | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第四届青训营 」笔记创作活动的的第19天事件监听在前端开发中,我们需要经常和用于交互。 这个时候,我们就必须监听用户发生的时间,比如点击、拖拽、键盘事件等等 在Vue中如何监听事件呢?使用v-on指令v-on介绍口作用:绑定事件监听器口缩写:@ 语法...原创 2022-08-22 23:44:03 · 29 阅读 · 0 评论 -
计算属性 | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第四届青训营 」笔记创作活动的的第18天什么是计算属性我们知道,在模板中可以直接通过插值语法显示一些data中的数据。但是在某些情况,我们可能需要对数据进行一些转化后再显示,或者需要将多个数据结合起来进行显示 比如我们有firstName和lastName两个...原创 2022-08-21 22:52:24 · 46 阅读 · 0 评论 -
Vue模块化 | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第四届青训营 」笔记创作活动的的第7天 为什么要有模块化解决命名冲突问题解决代码复用问题匿名函数的解决方案可以使用匿名函数来解决命名冲突问题匿名函数解决了命名冲突,但是不能代码复用 使用模块作为出口ES5:使用模块作为出口在匿名...原创 2022-08-10 21:32:49 · 35 阅读 · 0 评论 -
v-bind | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第四届青训营 」笔记创作活动的的第17天前面我们学习的指令主要作用是将值插入到我们模板的内容当中。但是,除了内容需要动态来决定外,某些属性我们也希望动态来绑定。 比如动态绑定a元素的href属性 比如动态绑定img元素的src属性这个时候,...原创 2022-08-20 22:23:17 · 47 阅读 · 0 评论 -
axios | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第五届青训营 」伴学笔记创作活动的第 10 天axios框架的基本使用axios的请求方式支持多种请求方式:axios(config)axios.request(config)axios.get(url[, config)axios.delete(url...原创 2023-02-12 23:28:32 · 95 阅读 · 0 评论 -
vue-router(一)-认识路由 | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第五届青训营 」伴学笔记创作活动的第 1 天什么是路由路由是一个网络工程里面的术语。路由(routing)就是通过互联的网络把信息从源地址传输到目的地址的活动. --- 维基百科路由器是做什么的? 你有想过吗?路由器提供了两种机制: 路由和转送.路由是决...原创 2023-02-03 23:55:49 · 68 阅读 · 0 评论 -
vue-router(二)-安装与使用 | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第五届青训营 」伴学笔记创作活动的第 2 天vue-router目前前端流行的三大框架, 都有自己的路由实现:Angular的ngRouterReact的ReactRouterVue的vue-routervue-router是Vue.js官方的路由插件,它和...原创 2023-02-04 23:52:16 · 140 阅读 · 0 评论 -
vue-router(三)-路由懒加载,嵌套路由 | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第五届青训营 」伴学笔记创作活动的第 3 天打包文件解析从服务器请求静态资源,从静态资源服务器请求第一次资源的时候,可能会花费很长时间,因为js文件很大,可能页面会出现很长时间空白vue在配置对js文件和css文件进行分包 将项目中的所有css相关全部分离到cs...原创 2023-02-05 23:18:45 · 204 阅读 · 0 评论 -
vue-router(四)-传递参数 | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第五届青训营 」伴学笔记创作活动的第 4 天准备工作为了演示传递参数, 我们这里再创建一个组件, 并且将其配置好第一步: 创建新的组件Profile.vue第二步: 配置路由映射第三步: 添加跳转的<router-link>传递参数的方式...原创 2023-02-06 23:07:31 · 730 阅读 · 0 评论 -
vue-router(五)-导航守卫 | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第五届青训营 」伴学笔记创作活动的第 5 天为什么使用导航守卫?我们来考虑一个需求: 在一个SPA应用中, 如何改变网页的标题呢? 网页标题是通过来显示的, 但是SPA只有一个固定的HTML, 切换不同的页面时, 标题并不会改变. 但是我们可以通过JavaSc...原创 2023-02-07 22:42:57 · 58 阅读 · 0 评论 -
vue-router(六)-keep-alive | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第五届青训营 」伴学笔记创作活动的第 6 天keep-alive案例:用户点击消息后跳转到其他组件,回到主页时,默认会显示新闻,这是因为默认组件会销毁,每次点进来是新创建的组件,而不是之前的组件,如果想保存这种状态,要使用keep-alive,保留被包含组件的状...原创 2023-02-08 23:48:58 · 300 阅读 · 0 评论 -
vue-router(七)-案例:TabBar | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第五届青训营 」伴学笔记创作活动的第 7 天TabBarTabBar实现思路1. 如果在下方有一个单独的TabBar组件,你如何封装自定义TabBar组件,在APP中使用让TabBar出于底部,并且设置相关的样式2.TabBar中显示的内容由外界决定...原创 2023-02-09 23:31:22 · 156 阅读 · 0 评论 -
v-model| 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第四届青训营 」笔记创作活动的的第20天表单控件在实际开发中是非常常见的。特别是对于用户信息的提交,需要大量的表单。 Vue中使用v-model指令来实现表单元素和数据的双向绑定。v-model原理v-model其实是一个语法糖,它的背后本质上是包含两个操作︰...原创 2022-08-23 23:26:02 · 70 阅读 · 0 评论 -
vuex | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第五届青训营 」伴学笔记创作活动的第 8 天vuex的概念及作用官方解释:Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式它采用 集中式存储管理 应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。Vuex 也集成到 Vue 的...原创 2023-02-10 23:57:45 · 60 阅读 · 0 评论 -
vuex-核心概念 | 青训营笔记
theme: condensed-night-purplehighlight: a11y-dark这是我参与「第五届青训营 」伴学笔记创作活动的第 9 天Vuex有几个比较核心的概念:State: 保存共享状态,存放状态相关信息Getters: 类似计算属性Mutation: 状态更新Action: 进行异步操作Module: 划分模块,针对不同模块进行相关数据的保...原创 2023-02-11 23:56:51 · 73 阅读 · 0 评论