Vue共14篇
vue打包性能优化核心方案 - 捕风阁

vue打包性能优化核心方案

打包不生成map文件 我们通常项目打包后,代码都是经过压缩加密的,如果运行时报错,输出的错误信息无法准确得知是哪里的代码报错。打包生成的map文件的作用就在于,map就可以像未加密的代码一样...
osuu的头像 - 捕风阁osuu10个月前
011012
vue3中script setup 语法糖 - 捕风阁

vue3中script setup 语法糖

简介 script setup 是 vue3 的新语法糖,并不是新增的功能模块,只是简化了以往的组合式 API 必须返回(return)的写法,并且有更好的运行时性能。 <script setup> ... </script> 使...
osuu的头像 - 捕风阁osuu2年前
121014
浅谈vue2和vue3的区别 - 捕风阁

浅谈vue2和vue3的区别

vue3新特性 速度更快 体积更小 更容易维护 更接近原生 更容易使用 相比Vue2,Vue3整体体积变小了,除了移出一些不常用的API,再重要的是Tree shanking 任何一个函数,如ref、reavtived、compute...
osuu的头像 - 捕风阁osuu2年前
0101315
封装vue组件发布到npm(详细步骤) - 捕风阁

封装vue组件发布到npm(详细步骤)

准备工作 1.注册npm账号:https://www.npmjs.com/ 2.保证当前环境下安装了 vue、webpack、node 创建组件项目 // 完整配置模板 vue init webpack 项目名称 // 更简洁的webapck配置模板 vue init...
osuu的头像 - 捕风阁osuu2年前
056210
vue中使用MathJax 3.0简单步骤 - 捕风阁

vue中使用MathJax 3.0简单步骤

前言 最近公司项目中需要用到Latex公式替代传统的图片加文字类题型展示,需要用到MathJax3.0,故特此记录 概述 MathJax是一款开源的JavaScript显示引擎,适用所有现代浏览器,使用MathJax可以方...
osuu的头像 - 捕风阁osuu3年前
023175
11 个高级 Vue 编码技巧 - 捕风阁

11 个高级 Vue 编码技巧

1、限制微信内访问 var useragent = navigator.userAgent.toLowerCase(); // 判断获取到的标识,微信标识为164;浏览器的标识为-1(360浏览器/谷歌浏览器) if (useragent.indexOf('micromessen...
osuu的头像 - 捕风阁osuu3年前
034612
vuex页面刷新数据丢失的解决办法 - 捕风阁

vuex页面刷新数据丢失的解决办法

在vue项目中用vuex来做全局的状态管理, 发现当刷新网页后,保存在vuex实例store里的数据会丢失。 原因: 因为store里的数据是保存在运行内存中的,当页面刷新时,页面会重新加载vue实例,store...
osuu的头像 - 捕风阁osuu4年前
010099
vue解决右键打开新的标签页,sessionStorage失效 - 捕风阁

vue解决右键打开新的标签页,sessionStorage失效

问题:项目使用sessionStorage存储已登录用户的token和用户信息,当右键新打开标签页时,sessionStorage为空,需重新登录。 需求:浏览器关闭时,清空用户所有登录信息,下次打开浏览器需重新登...
osuu的头像 - 捕风阁osuu4年前
0402612
vue变量赋值后双向绑定解决办法 - 捕风阁

vue变量赋值后双向绑定解决办法

如: this.list = this.list2, 结果在list改变后 list2也改变,这不是我们想要的效果 第一种:利用 JSON.parse 和 JSON.stringify this.list= JSON.parse( JSON.stringify(this.list2) ) 第二种...
osuu的头像 - 捕风阁osuu4年前
0141311
elementUI图片上传前端及后端写法例子 - 捕风阁

elementUI图片上传前端及后端写法例子

说明 我们平时自己开发项目的时候会用到图片上传,这里就把之前写的一个例子整理一下,使用elementUI完成图片上传   后端写法 <?php /** * 图片上传接口 * @author 捕风阁 www.osuu.net...
osuu的头像 - 捕风阁osuu4年前
0614911
vue及脚手架 - 捕风阁

vue及脚手架

在非脚手架vue页面中页面加载时渲染的数据会闪烁,我们可以添加以下css来解决 [v-cloak] { display: none; }   脚手架开发时如何给每个页面设置标题呢? 下载安装依赖 npm install vue-wech...
osuu的头像 - 捕风阁osuu4年前
0137211
前端常用的几个正则表达式 - 捕风阁

前端常用的几个正则表达式

验证方法: var reg = /^1[3456789]\d{9}$/; var user = reg.test(this.username);   11位手机号正则:/^1[3456789]\d{9}$/ 6-10位字母或数字:  /^[a-zA-Z0-9]{6,10}$/ 邮箱:/^[0-9a-z]...
osuu的头像 - 捕风阁osuu4年前
080515
封装一个登陆cookie存取函数 - 捕风阁

封装一个登陆cookie存取函数

这个是我在用Vue脚手架的时候写的,JS可以稍微改一下 //设置cookie方法 setCookie(portId, psw, exdays) { // Encrypt,加密账号密码 var cipherPortId = CryptoJS.AES.encrypt( portId + '', '...
osuu的头像 - 捕风阁osuu4年前
0103410
Vue build打包之后,刷新页面出现404解决方案 - 捕风阁

Vue build打包之后,刷新页面出现404解决方案

最近把自己的vue项目打包后传到服务器,访问页面发现404,因为我们的应用是个单页客户端应用,如果后台没有正确的配置,当用户在浏览器直接访问 http://osuu.net/user/id 就会返回 404,这就不...
osuu的头像 - 捕风阁osuu4年前
052518