
vue.js
波子的搬砖生涯
这个作者很懒,什么都没留下…
展开
-
Vue3 子组件使用setup语法糖 父组件ref 获取不到子组件的问题解决
defineExpose原创 2023-03-07 10:03:12 · 1036 阅读 · 0 评论 -
Vue3.0 监听外部容器宽度变化 自适应渲染echarts
Vue3.0 监听外部容器宽度变化 自适应渲染echarts原创 2023-02-08 15:18:36 · 1734 阅读 · 0 评论 -
【vue input文本框自动去空格和特殊字符 】全局自定义指令
// main.js 注册一个全局自定义指令 `不允许输入空格&*等特殊字符` 指令:v-filter-special-charVue.directive('filterSpecialChar', { update: function (el, { value, modifiers }, vnode) { try { let a_el=el.children[0] //此处可以debug看看el具体值是什么,这里演示的原创 2022-01-27 14:30:33 · 2108 阅读 · 0 评论 -
ant-design-vue table组件修改 选中行背景颜色
<a-table :rowKey=" (row, index) => { return index; } " :pagination="false" :columns="columns" :data-source="data..原创 2021-09-11 16:30:18 · 4019 阅读 · 0 评论 -
微信公众号开发 微信支付 本地联调jssdk 提示系统错误,错误码:63002,invalid signature
需求:公众号网页调用微信js-sdk完成微信支付遇到的问题:无法在本地进行联调通过微信的官方文档可以看到要在项目里调微信的api首先是需要在公众号设置里绑定安全域名的,然后需要将当前网页的URL,不包含#及其后面部分,传给后台生产wx初始化签名signature,等权限配置,才能够调起jsapi那么我们来看一下实现步骤吧第一步通过npm 引入npm install jweixin-...原创 2020-04-28 15:55:04 · 16663 阅读 · 3 评论 -
vue 重新渲染组件 重置组件状态
方案一:v-if(可以重置生命周期)当数据变更后,通过watch 监听,先去销毁当前的组件,然后再重现渲染。使用 v-if 可以解决这个问题<template> <third-comp v-if="reFresh"/></template> <script> export default{ data(){ ...原创 2020-04-13 13:59:42 · 1582 阅读 · 0 评论 -
uniapp 前端优化、打包优化
在cli创建uniapp之后打包体积太大,通过开启webpack摇树优化可以大大减少包的体积 开启前5m 开启后只有500kb,首屏加载时间大大缩短代码在manifest.json中增加这么一段"h5" : { "optimization":{ "treeShaking":{ "enable":true //启用摇树优化 } ...原创 2020-04-02 18:21:01 · 3407 阅读 · 0 评论 -
uniapp 更改输出目录,自定义打包目录
在用uniapp打包项目到生产服务器的时候每次都会多生成两个二级目录。导致静态资源访问出现一些问题。但是官方文档上vue.cofig.js中修改webpack配置outputDir这种方式是不支持的。最后发现需要在package.json打包命令中增加这么一句 UNI_OUTPUT_DIR=你的指定目录...原创 2020-04-02 09:59:37 · 12991 阅读 · 5 评论 -
Vue 如何监听session值的变化
如何监听session值的变化首先在在main.js给Vue.protorype注册一个全局方法//main.jsVue.prototype.resetSetItem = function (key, newVal) { if (key =='collapse') { // 创建一个StorageEvent事件 var newStorageEvent ...原创 2020-01-18 11:29:45 · 5787 阅读 · 1 评论 -
element ui实现下拉框远程搜索,请求后台获取数据并展示下拉内容
element已经给我们提供了此方法,需要在el-select中绑定几个属性即可通过remote-method来实现实时发起搜索请求 <el-select v-model="searchByName" filterable placeholder="请输入企业名称/姓名" remote...原创 2019-12-18 16:20:01 · 5579 阅读 · 3 评论 -
Vue使用路由守卫 钩子对路由进行权限拦截和跳转
方法很简单 思路就是登陆成功后将服务端返回的用户信息(token,用户名)存到session或者localstorage中,router.beforeEach判断session是否有token值对路由进行拦截跳转,如果没有就定向跳转到登陆页//使用钩子函数对路由进行权限跳转router.beforeEach((to, from, next) => { document.titl...原创 2019-11-01 14:07:37 · 1564 阅读 · 0 评论 -
Vue全局响应拦截器,请求头加token,错误跳转
这个应该不用多说直接上代码import axios from 'axios';const service = axios.create({ // process.env.NODE_ENV === 'development' 来判断是否开发环境 baseURL: 'http://192.168.50.86:8080', timeout: 5000,})//'sess...原创 2019-11-01 13:58:00 · 1772 阅读 · 0 评论 -
element ui el tag实现根据状态显示不同颜色标签
<el-tag :type="props.scope.row.delFlg=='0' ?'success':'info'">{{props.scope.row.stats}}</el-tag>element ui el tag实现根据状态显示不同颜色标签这里用了三元表达式通过获取当前行内状态值 动态改变tag颜色最终实现效果这里顺带提一下三元表达式 条件?真...原创 2019-11-01 13:12:27 · 11418 阅读 · 4 评论 -
Vue.js中子组件调用父组件函数
我们在用Vue开发引用组件的时经常会遇到互相调用函数的场景直接上代码子组件通过this.$emit(函数名)的方式来调用父组件里的函数父组件通过@在子组件上绑定一个自定义事件OK 我们来控制台看一下是否调用成功ok调用成功没有问题...原创 2019-10-25 13:13:53 · 781 阅读 · 0 评论