随笔分类 - vue
摘要：v-model的基本使用 表单提交是开发中非常常见的功能，也是和用户交互的重要手段： 比如用户在登录、注册时需要提交账号密码； 比如用户在检索、创建、更新信息时，需要提交一些数据； 这些都要求我们可以在代码逻辑中获取到用户提交的数据，我们通常会使用v-model指令来完成： v-model指令可以在
阅读全文
摘要：1、前言 本篇是Vue中最常用到的API之一computed属性，转载信息如下： 作者：gunelark链接：https://www.cnblogs.com/gunelark/p/8492468.html 2、正文 看了网上很多资料，对vue的computed讲解自己看的都不是很清晰，今天忙里抽闲，
阅读全文
摘要：20180224114219152.png 一 理解vue的核心理念 使用vue会让人感到身心愉悦,它同时具备angular和react的优点,轻量级,api简单,文档齐全,简单强大,麻雀虽小五脏俱全. 倘若用一句话来概括vue,那么我首先想到的便是官方文档中的一句话: Vue.js（读音 /vju
阅读全文
摘要：20180224114219152.png 一 理解vue的核心理念 使用vue会让人感到身心愉悦,它同时具备angular和react的优点,轻量级,api简单,文档齐全,简单强大,麻雀虽小五脏俱全. 倘若用一句话来概括vue,那么我首先想到的便是官方文档中的一句话: Vue.js（读音 /vju
阅读全文
摘要：前言 组件是 vue.js最强大的功能之一，而组件实例的作用域是相互独立的，这就意味着不同组件之间的数据无法相互引用。一般来说，组件可以有以下几种关系： 如上图所示，A 和 B、B 和 C、B 和 D 都是父子关系，C 和 D 是兄弟关系，A 和 C 是隔代关系（可能隔多代）。 针对不同的使用场景，
阅读全文
摘要：组件的分类 常规页面组件，由 vue-router 产生的每个页面，它本质上也是一个组件（.vue），主要承载当前页面的 HTML 结构，会包含数据获取、数据整理、数据可视化等常规业务。 功能性抽象组件，不包含业务，独立、具体功能的基础组件，比如日期选择器、弹窗警告等。这类组件作为项目的基础控件，会
阅读全文
摘要：在使用iview框架的时候，经常会看到组件用v-model双向绑定数据，与传统步骤父组件通过props传值子组件，子组件发送$emit来修改值相比，这种方式避免操作子组件的同时再操作父组件，显得子组件的封装效果更好。所以，个人认为，我们自己封装组件也应该有这样的思维，父组件通过slot或者props
阅读全文
摘要：1. 监控原理 1.1 onerror 传统的前端监控原理分为异常捕获和异常上报。一般使用onerror捕获前端错误： 1.2 promise 但是onerror事件无法捕获到网络异常的错误(资源加载失败、图片显示异常等)，例如img标签下图片url 404 网络请求异常的时候，onerror无法捕
阅读全文
摘要：1. 父组件中获取子组件方法 $children 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 <template> <div> <v-header></v-header> <v-content></v-content> <v-footer><
阅读全文
摘要：<input v-model="something"> v-model指令其实是下面的语法糖包装而成： <input :value="something" @:input="something = $event.target.value"> 在一个组件上使用 v-model 时，会简化为： <cus
阅读全文
摘要：一、Vue对比其他框架原理 Vue相对于React，Angular更加综合一点。AngularJS则使用了“脏值检测”。 React则采用避免直接操作DOM的虚拟dom树。而Vue则采用的是 Object.defineProperty特性（这在ES5中是无法slim的，这就是为什么vue2.0不支持
阅读全文
摘要：概念 先理解一下 Immutable 的概念，Immutable数据就是一旦创建，就不能更改的数据。每当对Immutable对象进行修改的时候，就会返回一个新的Immutable对象，以此来保证数据的不可变。但是由于 Immutable 的 API 和用法学习起来比较困难，所以可以使用 immuta
阅读全文
摘要：前言 我们经常用element-ui做后台管理系统，经常会遇到父组件给子组件传递数据，下面一个简单的例子，点击按钮，把弹框显示变量数据通过子组件的props属性传递，子组件通过$emit事件监听把数据回传给父组件。 父组件代码： 子组件代码： 感觉这样挺麻烦，父组件通过设置子组件的属性（props）
阅读全文
摘要：1.state state是什么? 定义:state(vuex) ≈ data (vue) vuex的state和vue的data有很多相似之处,都是用于存储一些数据,或者说状态值.这些值都将被挂载 数据和dom的双向绑定事件,也就是当你改变值的时候可以触发dom的更新. 虽然state和data有
阅读全文
摘要：最近接到一个业务需求,需要做一个聊天信息的实时展示的界面,这就需要和服务器端建立webSocket连接,从而实现数据的实时获取和视图的实时刷新.在此将我的实现记录下来,希望可以给有同样需求的人一些帮助.废话少说,下面我就来讲一下我的实现过程: 前提 要进行文章中的代码的测试,需要服务端端开发人员配合
阅读全文
摘要：Vue.prototype.$await = async function(action) { try { await action(); } catch (err) { // 这里是你处理错误的逻辑 console.log("Cought Error: ", err); } }; doSomething(...args) ...
阅读全文
摘要：前言 Hello，大家好，又与大家见面了，这次给大家分享下前端异常监控中需要了解的异常捕获与上报机制的一些要点，同时包含了实战性质的参考代码和流程。 首先，我们为什么要进行异常捕获和上报呢？ 正所谓百密一疏，一个经过了大量测试及联调的项目在有些时候还是会有十分隐蔽的bug存在，这种复杂而又不可预见性
阅读全文
摘要：一般在一个项目开始之前，我们一般会对现有的框架做一定功能上的丰富，比如对ajax请求功能的二次封装，封装的功能可能包含了：通用错误处理，请求过滤，响应过滤等等。如果我们封装的函数叫request，那么业务中触发一个ajax请求的流程大致如图：通常，这样的流程处理能满足需求，然而，更多的情况，我们希望
阅读全文
摘要：目的：vue-cli构建的vue单页面应用，某些特定的页面，实现前进刷新，后退不刷新，类似app般的用户体验。注： 此处的刷新特指当进入此页面时，触发ajax请求，向服务器获取数据。不刷新特指当进入此页面时，不触发ajax请求，而是使用之前缓存的数据，以便减少服务器请求，用户体验更流畅。 项目需求：
阅读全文
摘要：一直以来对computed和watch一知半解，用的时候就迷迷糊糊的，今天仔细看了看文档，突然茅塞顿开，原来就是这么简单啊： watch，通过自己改变别人 需要注意的是，computed会缓存数据，只有在满足以下两个条件时才会重新计算： 2、依赖型数据发生改变 如果不满足以上两个条件，compute
阅读全文