sven_chen93的博客

一、 当前路由切换this.$router.replace({ path: this.$route.path, query: { ...this.$route.query, methods: 'check', pageType: 'view' }})二、页面多个表单校验try { await Promise.all([ this.$refs.preStepForm.validate(), this.$refs.fileForm.validate(), ]);}

/**@name Vue2.0数据双向绑定（响应式系统）的实现原理*/// observe方法遍历并包装对象属性function observe(target) {// 若target是一个对象，则遍历它if (target && typeof target === “Object”) {Object.keys(target).forEach((key) => {// defineReactive方法会给目标属性装上“监听器”defineReactive(targ

路由跳转打开一个新的页签，自己Mark下let routeData = this.$router.resolve({ name: 'personDetail', query: { id: row.id, },})window.open(routeData.href, '_blank')

// 两个相同选项的值互斥<el-select v-model="valueA" multiple placeholder="请选择"> <el-option v-for="item of zsSelect" :key="item.id" :label="item.name" :value="item.id" :disabled="hasInclude(valueB, item.id)" /></el-select>在这里插入代码片

最近发现之前使用的flvjs插件，在IE11上报错的问题，报错内容如下：报的语法错误 at ./node_modules/flv.js/src/utils/polyfill.js 。遇到问题的第一时间，我也是百度找问题，但是上面都是说不支持IE11的视频推流，好吧我这边就和产品说：1.换插件，2.提示用户使用其他浏览器；最终还是需要兼容IE11，没办法，后续让同事帮忙看下并修改，我在忙其他的项目后面同事大佬在GitHub上找到flvjs的仓库，然后到里面找issue，最后找到了问题的原因并找到了解决

有时间需要编写一些过滤器，这边Mark下// filters.js文件const bdStatus = (value) => { const statusMap = { 1: '正常', 2: '异常', 3: '终止', 4: '暂停', } return statusMap [value] || value}export { statusMap }下面在main.js中定义：// main.js

有时候父组件需要直接调用子组件的方法<!-- 父组件引用子组件son --><template> <div> <div> <button @click='refreshBtn'>刷新son数据</button> </div> <son ref="son"> </son> </div></template><script> m

vue现在很多组件是相互间引用的，但是在不同组件中展示的样式怎么调试呢<div class="baseClass" :class="[{'specialClass':$route.name =='home'}]"></div>基础样式类在baseClass中定义，区别于其他组件，home路由中多了这个样式’specialClass’渲染。这样就支持在不同路由下，样式展示不一样了。...

最近在项目中看到一种新的父给子传值的方式，觉得很快捷迅速，记录一下1.下面是我们通常父给子组件传值的方式<template> <div id="app"> <users :users="usersData"></users> </div></template>2.下面是直接通过ref来传值<template> <div id="app"> <users ref="so

最近在做列表首页时，根据条件切换当前table，但是数据更新后，页面不刷新问题尝试了几种方法，还是没效果 1. 在nextTick中使用this.$refs.table.doLayout() 2. 在data赋值前清空tableData 3. 强制刷新：this.$forceUpdate()后面在blog中看到某位大佬的方法，给table加个key，页面就能更新了，所以Mark下<el-table ref="table" :data="tableData" :ke

Vue组件间通信6种方式摘要： 总有一款合适的通信方式。作者：浪里行舟Fundebug经授权转载，版权归原作者所有。前言组件是 vue.js 最强大的功能之一，而组件实例的作用域是相互独立的，这就意味着不同组件之间的数据无法相互引用。一般来说，组件可以有以下几种关系：如上图所示，A 和 B、B 和 C、B 和 D 都是父子关系，C 和 D 是兄弟关系，A 和 C 是隔代关系（可能隔多代）。针对不同的使用场景，如何选择行之有效的通信方式？这是我们所要探讨的主题。本文总结了 vue 组件间通信的

最近面试和平时工作中，改变了数组内的值，但是页面没有重新渲染，今天记录下解决方法直接修改不生效，代码如下<template> <div> <h2>数组展示：{{testArr}}</h2> <button @click="changeArr">修改数组</button> </div></template><script> export default { name: "fu

最近用vue 2.x + axios请求时，请求报400时，请求会报两次错误，相应拦截器会走两次，就是请求一次，相应拦截器会走两次；主要是只有请求报错时才会出现这个问题，请求200就不会出现问题。之前把问题发到了思否上，现在整过来记录下这是我在main.js里面设置的响应拦截器：axios.interceptors.response.use(function(res) { c...