![](https://img-blog.csdnimg.cn/20210220142001920.jpg?x-oss-process=image/resize,m_fixed,h_224,w_224)
Vue学习
文章平均质量分 86
记录web前端学习笔记,包括vue、typescript、css3等
L_Juan_Y
生活呀,开开心心就行
人生呀,快快乐乐就好
展开
-
Vue官方文档学习-处理边界情况
1.背景一些需要对 Vue 的规则做一些小调整的特殊情况,这些功能都是有劣势或危险的场景的2.访问元素&组件在绝大多数情况下,最好不要触达另一个组件实例内部或手动操作 DOM 元素。不过在一些情况下做这些事情是合适的;(1) 访问根实例在每个 new Vue 实例的子组件中,其根实例可以通过 $root 属性进行访问;所有的子组件都可以将这个实例作为一个全局 store 来访问或使用;【注意】对于 demo 或非常小型的有少量组件的应用来说这是很方便的。不过这个模式扩展到中大型应用来原创 2021-03-02 19:13:49 · 175 阅读 · 0 评论 -
Vue官方文档学习-动态组件和异步组件
1.在动态组件上使用keep-alive(1) 场景当在多个组件之间进行切换(如选项卡)的时候,为了避免重复渲染导致的性能问题,可能会想对组件进行缓存。比如在某个选项卡中选择了某个菜单阅读某篇长文章,切换选项卡再切换回来,如果没有保持组件状态,菜单将回到初始选中状态。<!-- 动态切换显示的组件 --><component v-bind:is="currentTabComponent"></component>(2) 原因在切换新标签时,Vue都创建了一个新原创 2021-02-24 10:49:45 · 139 阅读 · 0 评论 -
Vue官方文档学习-插槽
1. 场景在开发中,经常需要向一个组件传递内容:<!-- 渲染会出错 --><alert-box>Something bad happened.</alert-box>插槽就是Vue实现的一套内容分发的API,将元素作为承载分发内容的出口;2. 插槽内容插槽内可以包含任何模板代码,包括 HTML和其他组件;<!-- navigation-link组件定义 --><a v-bind:href="url" class="nav-原创 2021-02-23 18:44:19 · 124 阅读 · 0 评论 -
Vue官方文档学习-自定义事件
官方文档链接:https://cn.vuejs.org/v2/guide/components-custom-events.html1.事件名不同于组件和 prop,事件名不存在任何自动化的大小写转换,触发的事件名需要完全匹配监听这个时间所用的名称;// 提交事件this.$emit('myEvent')<!-- 写成kebab-case没有任何效果 --><my-component v-on:my-event="doSomething"></my-co.原创 2021-02-22 14:30:32 · 103 阅读 · 0 评论 -
Vue官方文档学习-Prop
1.Prop的大小写HTML中的属性名是大小写不敏感的,故浏览器会把所有大小写字符解释为小写字符,使用驼峰命名法的prop名需要使用其等价的kebab-case(短横线分隔命名),如果使用字符串模板,则不存在这个限制。Vue.component('blog-post', { // 在 JavaScript 中是 camelCase 的 props: ['postTitle'], template: '<h3>{{ postTitle }}</h3>'})<原创 2021-02-20 17:58:32 · 248 阅读 · 0 评论 -
ajax、fetch和axios的区别
一、jQuery ajax1.介绍统 Ajax 指的是 XMLHttpRequest(XHR),核心使用XMLHttpRequest对象;增加了对JSONP的支持2.缺点本身是针对MVC的编程,不符合现在前端**MVVM(Model-View-ViewModel)**的浪潮;VVM 的核心是 ViewModel 层,它就像是一个中转站(value converter),负责转换 Model 中的数据对象来让数据变得更容易管理和使用;ViewModel 层向上与视图层进行双向数据绑定,向原创 2020-09-22 22:48:54 · 100 阅读 · 0 评论 -
Vue官方文档学习-组件
组件基础1.定义组件是可复用的Vud实例,与new Vue接收相同的选项,包括data、computed、watch、methods以及生命周期钩子。el是根实例特有的选项.【注意】:data属性必须是一个函数,以让每个实例都可以独立维护一份被返回对象的独立的拷贝。否则,多次使用同一个组件,若某个实例改变了data中的属性值,会导致其余实例也被修改。举例// 定义一个名为 button-counter 的新组件Vue.component('button-counter', { // 1原创 2021-02-20 14:18:27 · 180 阅读 · 0 评论