随笔分类 - VUE
摘要：在vue中动态的引入图片为什么要使用require 有些小伙伴，可能会轻蔑一笑：呵，就这，因为动态添加src被当做静态资源处理了，没有进行编译，所以要加上require， 我倒着都能背出来...... emmm... 乍一看好像说的很有道理啊，但是仔细一看，这句话说的到底是个啥？针对上面的回答，我不
阅读全文
摘要：import { Directive } from 'vue' const getInput = (el: HTMLElement) => { let inputEl: HTMLElement | null if (el.tagName !== 'INPUT') { inputEl = el.que
阅读全文
摘要：刚开始登录成功了，但是随后的其他接口由于没有带上cookie，导致都鉴权失败，不能愉快的调接口了， 通过vite文档以及http-proxy得到这个配置 cookieDomainRewrite 如下设置就ok了
阅读全文
摘要：在vue文件的script中打上一个debugger，本以为可以开心的debugger了，结果控制台看到的是这个样子 查了一些方案，这样就可以解决了
阅读全文
摘要：一番操作发现切换路由竟然没效果，控制台打印了警告 原因是确实根节点，按照如下方式解决，可以愉快的进行路由切换了
阅读全文
摘要：**在vue中动态的引入图片为什么要使用require 什么是静态资源？ 为什么动态添加的src会被当做的静态的资源？ 没有进行编译，是指为是什么没有被编译？ 加上require为什么能正确的引入资源，是因为加上require就能编译了？ 1、什么是静态资源 与静态资源相对应的还有一个动态资源，先让
阅读全文
摘要：target：要使用url模块解析的url字符串 forward：要使用url模块解析的url字符串 agent：要传递给http.squest的对象（请参阅Node的https代理和http代理对象） ssl：要传递给https.createServer（）的对象 ws：是/否，如果您想代理web
阅读全文
摘要：在很多系统中都想用一个登录功能，而且是弹窗的形式，本想着cv大法，但是一旦项目多了就难受了，后期维护。。。 <el-dialog ref="loginDialog" custom-class="login-dialog" :visible="$showLogin" width="798px" :sh
阅读全文
摘要：<template> <div class="base-count-down"> <div class="content"> <slot v-bind="{ d: days, h: hours, m: mins, s: seconds, hh: `00${hours}`.slice(-2), mm:
阅读全文
摘要：1、首先创建loading文件夹添加index.js和index.vue //index.js import Loading from "./index.vue"; export default { // 实现插件必须的install方法 install(Vue, options) { const
阅读全文
摘要：随着项目的页面越来越多体积越来越大，dev构建速度和pro打包速度越来越慢，然后就抽时间对项目进行了webpack升级来提升一下速度 升级过程中遇到了很多的坑，基本都是plugin和loader升级后的一些用法问题，花了一个晚上和一个上午时间，过程很痛苦，但是看到 速度的大幅度提示，还是很开心的 先
阅读全文
摘要：initGlobalAPI(Vue) 初始化全局函数 为Vue 添加 config，util，set，delete，nextTick，observable，options, use mixin extend 'component', directive filter 等属性和方法 initMixin
阅读全文
摘要：//点击目标元素外侧触发特定事件 使用 v-clickoutsides="clickHandler" import Vue from 'vue' Vue.directive('clickoutsides', { bind: function(el, binding, vnode) { functio
阅读全文
摘要：第1种写法 test.vue <template functional> <div class="test"> {{props.test.name}} </div> </template> <script> export default { props: { test: Object, defaul
阅读全文
摘要：未做国际化处理 tabLabel: { type: Array, default: () => (["a", "b", "c"]) } 初次国际化处理 出现报错 tabLabel: { type: Array, default: () => ([this.$t('status.a'), this.$
阅读全文
摘要：```html v-if和v-for {{list.title}} {{list.title}} --> ```
阅读全文
摘要：一，对整个对象监视 二，对指定key进行监视 三，结合computed
阅读全文
摘要：不使用keep alive对路由组件缓存，AB来回切换打印结果如下 组件来回切换，会重新创建和销毁（A组件的销毁发生在B组件beforeMount和mounted之间） 使用keep alive对路由组件缓存，AB来回切换打印结果如下 组件只会在第一次创建，随后来回切换不会发生销毁
阅读全文
摘要：注意：这里的data是一个函数，而不是对象
阅读全文
摘要：export default function printFile(html) { let userAgent = navigator.userAgent; if ( (userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE")
阅读全文
