230浏览

0评论

Vant Weapp组件踩坑:picker的初始赋值解决

在使用vant的picker组件时，我希望有在页面加载时向数据库获取值来设置picker的默认值。开始我使用官方文档中的default-index属性，并在onLoad方法中进行this.setData()。但是...

• 2021-05-31

176浏览

0评论

vue 获取url参数、get参数返回数组的操作

这是vue过滤器 获取url参数，返回数组Vue.prototype.$url=function(){ var url = decodeURIComponent(location.search); //获取url中"?"符后的字串 var theRequest = new...

• 2021-05-31

118浏览

0评论

vue实现lodop打印功能的示例

1.官网下载http://www.lodop.net/download.html2.解压安装运行3.vue部分实现　　3.1将lodopDuncs.js文件放入工程中，具体操作可见：http://www.lodop.net/faq/pp35.html3.2 编...

• 2021-05-31

302浏览

0评论

vant-ui框架的一个bug(解决切换后onload不触发)

前几天做的项目里有用到下拉刷新。使用了vant-ui里的List 列表瀑布流滚动加载，用于控制长列表的展示先说使用 1.用npm下载该模块包npm i vant -S2.引入组件官方提供了三种方...

• 2021-05-31

103浏览

0评论

Vue 401配合Vuex防止多次弹框的案例

1.安装Vuexnpm install vuex --save2. 新建store目录结构3. 编辑store.jsimport Vuex from 'vuex'import Vue from 'vue'import defaultState from './state/state'import m...

• 2021-05-31

156浏览

0评论

让Vue响应Map或Set的变化操作

问题背景我想在vuex的state中使用map，这样可以使很多操作变得方便const state = { all: new Map()}这样的写法是没有问题的，不会报错，state.all可以像正常的Map一样使用。但是...

• 2021-05-31

140浏览

0评论

vant 中van-list的用法说明

van-list里面的元素不能有float样式，否则会连续触发 load 事件原代码<template> <div class="about"> <van-tabs v-model="active" sticky @change="getTypeDate"> <van-t...

• 2021-05-31

70浏览

0评论

详解vue 组件的实现原理

组件机制的设计，可以让开发者把一个复杂的应用分割成一个个功能独立组件，降低开发的难度的同时，也提供了极好的复用性和可维护性。本文我们一起从源码的角度，了解一下组件的底层...

• 2021-05-31

95浏览

0评论

Vue+Spring Boot简单用户登录(附Demo)

1 概述前后端分离的一个简单用户登录 Demo 。2 技术栈 Vue BootstrapVue Kotlin Spring Boot MyBatis Plus3 前端3.1 创建工程使用 vue-cli 创建，没安装的可以先安装：sud...

• 2021-05-31

139浏览

0评论

Vue向后台传数组数据,springboot接收vue传的数组数据实例

用axios前台代码： let menus_id = this.$refs.tree.getCheckedKeys(); //菜单id [1,2,3]数组 this.$axios.get("/api/epidemic/roleMenus/addBath1",{params:{roleid:this...

• 2021-05-31

152浏览

0评论

vue打包通过image-webpack-loader插件对图片压缩优化操作

vue正常打包之后一些图片文件很大，使打包体积很大，通过image-webpack-loader插件可将大的图片进行压缩从而缩小打包体积step1：npm install image-webpack-loader --save-devste...

• 2021-05-31

106浏览

0评论

解决vue打包 npm run build-test突然不动了的问题

今天遇到一件很奇葩的事情输入npm run build-test 突然停在这不动了 what&#63; 不动了？！后来google了一下 大家都是人才运行一下这句话 就动了！！npm config set registry http:/...

• 2021-05-31

62浏览

0评论

Vue3 响应式侦听与计算的实现

响应式侦听和计算有时我们需要依赖于其他状态的状态——在 Vue 中，这是用组件 计算属性 处理的，以直接创建计算值，我们可以使用 computed 方法：它接受 getter 函数并为 getter...

• 2021-05-31

207浏览

0评论

解决vant的Toast组件时提示not defined的问题

按照官方文档引入全局Toast组件，在methods里面定义函数执行函数时产生了报错：//定义的函数handleClick(){ Toast('点击提示')}报错信息[Vue warn]: Error in v-on handler: "R...

• 2021-05-31

103浏览

0评论

vue 实现element-ui中的加载中状态

需要添加加载状态，调用下面方法即可//开启loadingconst load = _this.$loading({lock: true,text: 'Loading',spinner: 'el-icon-loading',background: 'rgba(0, 0, 0, 0.7)'...

• 2021-05-31

89浏览

0评论

在elementui中Notification组件添加点击事件实例

1. 官方文档2. 添加点击事件，传参handleClick() { let telNo = "1111", message = "22222", _this = this; //函数作用域问题 this.$notify({ title: "通知消息", position:...

• 2021-05-31

75浏览

0评论

VUE前端从后台请求过来的数据进行转换数据结构操作

我就废话不多说了，大家还是直接看代码吧`let label(){let _this = this;let _offset = (_this.pagination.currentPage - 1) * _this.pagination.pageSizelet params ={offse...

• 2021-05-31

121浏览

0评论

使用Vant完成DatetimePicker 日期的选择器操作

效果展示：代码展示：<template> <div id="date_time_picker"> <van-button plain type="primary" @click="showPopFn()">点击选择日期</van-button> <van-field v-model="time...

• 2021-05-31

85浏览

0评论

在vue中给后台接口传的值为数组的格式代码

比如你要传的数组是在data中的return中的params中的Arrays。传值格式需要如下：{flag: 1, data: this.params.Arrays}如果要求是json格式，记得后面要加{headers:{'Content-Type...

• 2021-05-31

90浏览

0评论

vue 解决mintui弹窗弹起来,底部页面滚动bug问题

经过dom层层注释缩小反馈终于找到问题所在。问题经过我在弹起弹窗的时候，设置了popupVisible为true然后触发了vue的updated生命周期钩子函数然后我在这个函数里面做了去this....

• 2021-05-31

104浏览

0评论

vue封装自定义指令之动态显示title操作(溢出显示,不溢出不显示)

vue项目开发的过程中，如果需要文字溢出的dom元素鼠标悬浮时才显示title文字的话，可以封装一个自定义的指令。方法一、组件内代码如下： directives: { title: { inserted(el)...

• 2021-05-31

142浏览

0评论

使用Vant完成通知栏Notify的提示操作

效果：代码展示：<template> <!-- 通知消息提示 --> <div id="notify"> <van-button type="primary" @click="toNotify" class="btn">顶部通知</van-button> </div></template>...

• 2021-05-31

99浏览

0评论

使用Vant完成Dialog弹框案例

效果展示：完整代码：<template> <!-- 完成Dialog 弹框 --> <div id="dialog"> <van-button class="btn" type="primary" @click="TipDialog">提示弹出框</van-button> <van-b...

• 2021-05-31

194浏览

0评论

Vue 解决在element中使用$notify在提示信息中换行问题

在项目开发过程中，遇到如下用户体验提升需求：需要实现错误提示时根据后台返回错误列表信息，换行展示。实现方式如下：通过F12元素查看，在对应的样式中加入white-space:pre-wrap，该...

• 2021-05-31

79浏览

0评论

VUE-ElementUI 自定义Loading图操作

需求：element ui loading图只能使用自己的loading图，但很多场景下，需要替换成自己的gif图虽然文档中有些， element-loading-spinner="el-icon-loading" 可指定自定义图但经测试，...

• 2021-05-31

63浏览

0评论

vue项目中使用rem,在入口文件添加内容操作

在使用vue-cli搭建好项目框架后,在目录结构的index.html文件中添加一段js代码:<script> window.onload = function () { var setRem = function () { // UI设计稿的宽...

• 2021-05-31

84浏览

0评论

vue项目实现减少app.js和vender.js的体积操作

配置webpack中externals来减少打包后vendor.js的体积在日常的项目开发中，我们会用到各种第三方库来提高效率，但随之带来的问题就是打包后的vendor.js体积过大，导致加载时空白页...

• 2021-05-31

92浏览

0评论

vue 解决provide和inject响应的问题

官网上说provide 和 inject 绑定并不是可响应的。这是刻意为之的。然而，如果你传入了一个可监听的对象，那么其对象的属性还是可响应的。provide：Object | () => Object（一个对象...

• 2021-05-31

56浏览

0评论

Vue中nprogress页面加载进度条的方法实现

nprogress页面加载进度条 前言很多时候在访问网页的时候我们总是看到页面在加载中，可以却不知道要加载多久，无期限的等待总是让人烦躁不安，所以我们希望能知道网页加载的进度，这...

• 2021-05-31

101浏览

0评论

解决vant框架做H5时踩过的坑(下拉刷新、上拉加载等)

1. 页面在手机端不能上下滑动，在PC端浏览器正常滑动说明：在设置了overflow:auto;属性的前提下，H5页面在PC端浏览器里展示可以上下滑动，在ios上可正常滑动，在安卓手机 上不能上下...

• 2021-05-31

82浏览

0评论

vue的$http的get请求要加上params操作

vue GET传递参数要加上paramsthis.$http.get('/operation/customer/question/edits',{params:{id: 10}})另外说一句，现在VUE官方推荐使用axiosvue-resource不更新了补充知识：v...

• 2021-05-31

74浏览

0评论

vue 使用localstorage实现面包屑的操作

mutation.js代码：changeRoute(state, val) { let routeList = state.routeList; let isFind = false; let findeIdex = 0; //菜单栏和下拉的二级菜单 if (val...

• 2021-05-31

82浏览

0评论

适用于 Vue 的播放器组件Vue-Video-Player操作

如果h5的标签<vedio>不能满足你的需求，那就用这个组件Vue-Video-Player吧，也许可以覆盖到你的需求。<video-player class="video-player vjs-custom-skin" ref="videoPlay...

• 2021-05-31

73浏览

0评论

vue print.js打印支持Echarts图表操作

网上找的print.js做了修改，支持Echarts图表这里记录一下，不知道是哪家的代码了，我看都一样这里是看到了两个源码https://github.com/xyl66/vuePlugs_printjs/blob/master/print...

• 2021-05-31

93浏览

0评论

解决iView Table组件宽度只变大不变小的问题

示例：<Table class="my-table"></Table>打开开发者工具其实你可以发现iView给table标签的宽度加上了一个明确的宽度值，而且在父元素变小的时候这个值并没有相应地变小，所以才会...

• 2021-05-31

84浏览

0评论

vue 授权获取微信openId操作

1、获取url中参数code； 根据code 获取openId；调用后台接口获取openId 。参考文档：https://mp.weixin.qq.com/wiki&#63;t=resource/res_main&id=mp1421140842function getUrlKey...

• 2021-05-31

68浏览

0评论

vue+Element-ui前端实现分页效果

本文实例为大家分享了vue+Element-ui前端实现分页效果的具体代码，供大家参考，具体内容如下分页技术分页技术的概念分页就是将所有的数据分段展示给用户，用户看到的可能不是全部...

• 2021-05-31

95浏览

0评论

vue实现抽屉弹窗效果

本文实例为大家分享了vue实现抽屉弹窗效果的具体代码，供大家参考，具体内容如下以下代码比较简单。主要就是实现 侧边弹窗而且不会影响页面操作的方式，求点赞！！！不多说直接贴代码。...

• 2021-05-31

62浏览

0评论

基于Vue+Webpack拆分路由文件实现管理

事实是，如果你的项目不是特别大，一般是用不着分拆的。如果项目大了，那就需要考虑分拆路由了。其实，这个操作并不复杂。当我们用 vue-cli 工具，创建一个新的 vue 项目时，就已经给大...

• 2021-05-31

85浏览

0评论

浅谈vue在html中出现{{}}的原因及解决方式

原因：浏览器渲染机制，解析html结构 -> 加载外部脚本和样式表文件 -> 解析并执行脚本代码 -> 构造html dom模型 -> 加载图片等外部文件 -> 页面加载完毕。初始化vue的js写在页...

• 2021-05-31

95浏览

0评论

Vue 使用iframe引用html页面实现vue和html页面方法的调用操作

当我们需要在vue中使用其他模块或者其他地方的一些html页面功能时，我们可以使用iframe去引用html页面，实现他们的交互首先我们可以再vue页面中使用标签引用html页面<template>...

• 2021-05-31

58浏览

0评论

Vue基于localStorage存储信息代码实例

一 什么是localStorage对浏览器来说，使用 Web Storage 存储键值对比存储 Cookie 方式更直观，而且容量更大，它包含两种：localStorage 和 sessionStoragesessionStorage（临时存储） ：...

• 2021-05-31

44浏览

0评论

Vue 实现拨打电话操作

我就废话不多说了，大家还是直接看操作吧~<p>联系电话：<a :href="'tel:' + item.phone" rel="external nofollow" >{{item.phone}}</a></p>补充知识：vue移动项目中如何设置点击...

• 2021-05-31

87浏览

0评论

VueCli生产环境打包部署跨域失败的解决

常见的跨域配置(/config/index.js):proxyTable: { '/api': { target: 'http://192.168.2.139:8080/Mobile/Max', // 接口的域名 // secure: false, // 如果是https接口，需要...

• 2021-05-31

180浏览

0评论

在vue中嵌入外部网站的实现

利用iframetop:导航栏的heightleft:左侧菜单栏的widthsrc:右侧页面要嵌入的外部网站<template> <div> <iframe src="https://www.iconfont.cn/" id="mobsf" scrolling="no"...

• 2021-05-31

153浏览

0评论

解决iview table组件里的 固定列 表格不自适应的问题

当在使用iview Table组件里固定列功能时出现表格不自适应宽度问题 具体如下解决这个bug 很简单 把组件里的 width 改为 minWidth 即可columns: [ { title: '账户名', k...

• 2021-05-31

91浏览

0评论

Vue 列表页带参数进详情页的操作(router-link)

首先，仔细看文档！！！一点一点的踩坑过来的~~~这里介绍params和query两种方法1.用params传参列表页：<router-link :to="{ name:'msgDetail', params: {id: item.msg_id} }">（注意：用p...

• 2021-05-31

90浏览

0评论

详解vue修改elementUI的分页组件视图没更新问题

今天遇到一个小问题平时没留意，el-pagination这个分页组件有一个属性是current-page当前页。
今天想在methods里面手动修改他绑定的变量从而达到修改页码的效果，结果发现分页...

• 2021-05-31

91浏览

0评论

vue+Element-ui实现分页效果

本文实例为大家分享了vue+Element-ui实现分页效果的具体代码，供大家参考，具体内容如下当我们向后台请求大量数据的时候，并要在页面展示出来，请求的数据可能上百条数据或者更多的...

• 2021-05-31

505浏览

0评论

vuex中遇到的坑,vuex数据改变,组件中页面不渲染操作

vuex数据改变，组件中页面不渲染相信许多vuex新手都会遇到这样的问题：vuex数据更新后，插件中使用数据的地方没有更新这样的代码data() { return { tableData: this.$store.stat...

• 2021-05-31