随笔分类 - vue
vue---el-switch值true、false改为number类型的1和0
摘要：需求描述：后端传回的status值为1（number类型）对应el-switch值true（打开）状态，status值为0（number类型）对应el-switch值false（关闭）状态。 <el-switch active-value="1" inactive-value="0" v-model
阅读全文
vue-router 如何在新窗口打开页面
摘要：1. <router-link>标签实现新窗口打开： 官方文档中说 v-link 指令被 <router-link> 组件指令替代，且 <router-link> 不支持 target="_blank" 属性，如果需要打开一个新窗口必须要用<a>标签，但事实上vue2版本的 <router-link
阅读全文
vue使用typescript，三种组件传值方式
摘要：Vue 2.0 typescript 写法传值方式： 随着 typescript 越来越受到前端框架的关注，最近使用 vue + typescript 做了一个项目。发现写法与 vue + js 完全不一样。但是原理相同。接下来给大家介绍 Vue 开发中常用的传值方式。 Vue 常用的三种传值方式有
阅读全文
vue在使用ts时如何使用axios
摘要：在vue中使用typescript时，当你想要在全局按照this.$axios这种形式来使用axios话，我们首先要将axios挂载到vue的原型上，使之能够在全局使用。 Vue.use(v => { v.prototype.$axios = axios }) 但是，这样还不行，typescript
阅读全文
vue-cli3构建TS项目（基础篇）
摘要：概述：template 和 style 跟以前的写法保持一致，只有 script 的变化 Vue三个TS封装库vue-class-component vue-class-component 对 Vue 组件进行了一层封装，让 Vue 组件语法在结合了 TypeScript 语法之后更加扁平化vue-
阅读全文
vue + typescript 进阶篇
摘要：vue + typescript 进阶篇 本文是继 Vue + TypeScript 新项目起手式 之后的进阶+踩坑配置，所以推荐先行阅读前文 完整阅读完之后，基本可以顺利在新项目中使用vue + typescript 了 另外特别注意！！！ 不推荐在已有项目上强加 typescript， 因ts写
阅读全文
vue + typescript 项目
摘要：最后更新于2018-06-30，技术文具有时效性，请知悉 我知道你们早就想用上 vue + ts 强类型了 还有后续 vue + typescript 进阶篇 安装vue-cli 安装ts依赖 配置 webpack 添加 tsconfig.json 添加 tslint.json 让 ts 识别 .v
阅读全文
如何解决vuex页面刷新数据丢失问题？
摘要：1、问题描述： 一般在登录成功的时候需要把用户信息，菜单信息放置vuex中，作为全局的共享数据。但是在页面刷新的时候vuex里的数据会重新初始化，导致数据丢失。因为vuex里的数据是保存在运行内存中的，当页面刷新时，页面会重新加载vue实例，vuex里面的数据就会被重新赋值。 2、解决思路： 办法一
阅读全文
vue中v-if和v-for指令为什么最好不要同时使用
摘要：建议不要在与v-for相同的元素上使用v-if。因为v-for指令的优先级高于v-if当它们处于同一节点。v-for 的优先级比 v-if 更高，这意味着 v-if 将分别重复运行于每个 v-for 循环中。 <ul> <li v-for="user in users" v-if="user.isA
阅读全文
vue：路由实现原理
摘要：随着前端应用的业务功能起来越复杂，用户对于使用体验的要求越来越高，单面（SPA）成为前端应用的主流形式。大型单页应用最显著特点之一就是采用的前端路由系统，通过改变URL，在不重新请求页面的情况下，更新页面视图。 更新视图但不重新请求页面，是前端路由原理的核心之一，目前在浏览器环境中这一功能的实现主要
阅读全文
vue-router实现原理
摘要：vue-router实现原理 近期面试，遇到关于vue-router实现原理的问题，在查阅了相关资料后，根据自己理解，来记录下。我们知道vue-router是vue的核心插件，而当前vue项目一般都是单页面应用，也就是说vue-router是应用在单页面应用中的。那么，什么是单页面应用呢？在单页面应
阅读全文
单向数据流和双向数据流
摘要：在react中是单向数据绑定，而在vue中的特色是双向数据绑定。但是其实就我个人的理解是： 其实无论是vue还是react其实还是提倡单向数据流去管理状态，这一点在vuex和redux状态管理器上体现的很明显。只是vue为UI控件提供了双向数据绑定的方式，在一些需要实时反应用户输入的场合会非常方便。
阅读全文
vue与react对比
摘要：相同点 1.都使用 virtual DOM 2.都是组件化开发 or 都提供了组件化的视图组件 3.数据的改变会引起视图的二次渲染 4.都只有骨架，其他的功能如路由、状态管理等是框架分离的组件。 5.都将注意力集中保持在核心库，有丰富的插件库 区别 1.渲染页面的方式不同：vue使用更简单的模版，变
阅读全文
MVVM框架简单实现
摘要：众所周知当下是MVVM盛行的时代，从早期的Angular到现在的React和Vue，再从最初的三分天下到现在的两虎相争。 无疑不给我们的开发带来了一种前所未有的新体验，告别了操作DOM的思维，换上了数据驱动页面的思想，果然时代的进步，改变了我们许多许多。 啰嗦话多了起来，这样不好。我们来进入今天的主
阅读全文
如何阅读大型前端开源项目的源码(转)
摘要：作者简介 Daniel 蚂蚁金服·数据体验技术团队 转自: https://github.com/ProtoTeam/blog/blob/master/201805/3.md 目前网上有很多「XX源码分析」这样的文章，不过这些文章分析源码的范围有限，有时候讲的内容不是读者最关心的。同时我也注意到，源
阅读全文
教你搭建基于typescript的vue项目
摘要：自尤大去年9月推出vue对typescript的支持后，一直想开箱尝试，对于前端sr来说，vue的顺滑加上ts的面向对象，想着就非常美好~ 终于在两个月前，找到了个机会尝试了一把vue+ts的组合。 开文记录下vue和ts整合之旅和遇到的一些坑。 vue 应该大部分人都知道vue，毕竟如今vue是与
阅读全文
搜索关键字变色突出显示
摘要：//文字变红色//content:关键字//ele:内容区域Common.prototype.textToRed =function(content, ele) { var bodyHtml = $(ele).html(); //去掉标红的font标签 bodyHtml = bodyHtml.rep
阅读全文
深入理解vue-router之keep-alive
摘要：keep-alive 简介 keep-alive 是 Vue 内置的一个组件，可以使被包含的组件保留状态，或避免重新渲染。 用法也很简单： ? 1 2 3 4 5 <keep-alive> <component> <!-- 该组件将被缓存！ --> </component> </keep-alive
阅读全文
vue组件通信方式总结
摘要：对于vue来说，组件之间的消息传递是非常重要的，下面是我对组件之间消息传递的各种方式的总结，总共有8种方式。 1. props和$emit 父组件向子组件传递数据是通过prop传递的，子组件传递数据给父组件是通过$emit触发事件来做到的。 Vue.component('child',{ data(
阅读全文
vue数据请求显示loading图
摘要：一般项目中，有时候会要求，你在数据请求的时候显示一张gif图片，然后数据加载完后，消失。这个，一般只需要在封装的axios中写入js事件即可。当然，我们首先需要在app.vue中，加入此图片。如下： <template> <div id="app"> <loading v-show="fetchLo
阅读全文
