Vue
I'm写代码
我其实是个冲浪小能手
展开
-
Vue里面qrcodejs2生成二维码
Vue里面qrcodejs2生成二维码原创 2022-02-08 09:17:40 · 424 阅读 · 0 评论 -
Vue实现excel文件下载
Vue实现excel文件下载话不多说,直接上代码1、安装插件cnpm install vue-json-excel2、导出按钮 <!--导出用户信息excel表格--> <download-excel class = "export-excel-wrapper" :data = "json_data" :fields = "json_fields" name = "用户信息列表.xls">原创 2020-08-11 11:26:35 · 6773 阅读 · 3 评论 -
amap高德地图应用(el-amap-marker坐标点;el-amap-info-window信息窗体;el-amap-polyline折线、折线颜色,宽度、实虚线等)
amap高德地图应用(el-amap-marker坐标点;el-amap-info-window信息窗体;el-amap-polyline折线、折线颜色,宽度、实虚线等)原创 2022-01-29 14:57:05 · 6263 阅读 · 1 评论 -
结合vuex本地存储state全局变量值(避免页面刷新数据丢失)
结合vuex本地存储state全局变量值(避免页面刷新数据丢失)问题描述:通过接口获取的数据进行变量接收后,如果刷新页面,需要重新进行接口请求,这样有时候会造成需要渲染的数据丢失。解决方法如下:1、store中定义全局变量:import Vue from "vue";import Vuex from "vuex";Vue.use(Vuex);export default new Vuex.Store({ state: { /*定义组件间通信变量*/ dayEvents:原创 2020-11-09 23:34:14 · 3660 阅读 · 0 评论 -
vue里面watch监听当前路由信息
vue里面watch监听当前路由信息原创 2022-01-27 15:49:45 · 1912 阅读 · 0 评论 -
vue里mock数据配置
vue里面mock数据配置原创 2022-01-25 16:08:32 · 1131 阅读 · 0 评论 -
Vuex使用以及namespaced注意事项
Vuex使用以及namespaced注意事项Vuex使用需要某个变量为全局变量时,可以采用Vuex来进行实现,简单案例说明:1.安装Vuex有的话可省略npm install --save vuex2.在src下新建store文件夹且在store文件下新建index.js以及modules/getValues.js3.在getValues.js设置全局变量的state,代码如下:注:namespaced: true 的方式使其成为带命名空间的模块。保证在变量名一样的时候,添加一个父级名拼接,原创 2022-01-13 17:01:39 · 704 阅读 · 0 评论 -
blob数据格式下载excel文件
blob数据格式下载excel原创 2022-01-11 16:34:46 · 1764 阅读 · 0 评论 -
blob数据格式excel文件下载
blob数据格式excel文件下载原创 2022-01-11 15:20:20 · 480 阅读 · 0 评论 -
map数据转数组(简单记录)
map数据转数组(简单记录)methods:const newArr = []for(const key in map){ const jsonTemp = {} jsonTemp.D_dictName = map[key] jsonTemp.D_dictId = key newArr.push(jsonTemp)}console.log(newArr,'map数据转arr')原创 2021-10-16 17:58:15 · 932 阅读 · 0 评论 -
el-table实现根据条件对特定的table-cloumn进行是否可勾选
el-table实现根据条件对特定的table-column进行是否可勾选<el-table-columntype="selecttion"label="选择"width="55":selectable="selectable"></el-table-column>methods:selectable(row,index){ if(row.userId==='hhh'){ return false }else{ re原创 2021-09-24 12:29:34 · 703 阅读 · 0 评论 -
计算2个日期之前相隔的时间差(天数,小时数,分钟数,秒数)
计算2个日期之前相隔的时间差(天数,小时数,分钟数,秒数)export function getDays(beginTime, endTime) {var dateDiff = endTime.getTime()一beginTime.getTime()//相差天数var dayDiff = Math. floor(dateDiff/ (24 *3600 * 1000)) var leave1 = dateDiff % (24*3600*1000)var hours = Math. floor原创 2021-09-22 09:05:57 · 1336 阅读 · 0 评论 -
this.$router.push路由跳转携带参数实现传参
this.$router.push路由跳转携带参数实现传参<template> <div> <el-button>点击跳转到用户管理页面(携带参数)</el-button> </div></template><script> export default { name:'casePage', data(){ return{ userCode:'zhansa原创 2021-09-04 19:13:32 · 525 阅读 · 0 评论 -
组件间通过refs进行传值(简单记录)
组件间通过refs进行传值模拟:test组件向test2组件传值,父组件test里面通过ref对test2组件进行标识挂载,方法区通过this.$refs.ref标识.子组件方法即可进行传值test组件:<template> <div> 我是父组件 <el-button @click="giveChildValue()">点击给子组件传个值</el-button> <test2 ref="test2Flag">&l原创 2021-09-04 19:03:16 · 1624 阅读 · 1 评论 -
vue后台管理系统项目实战(三)
vue后台管理系统项目实战(三)不定期更新…项目地址:https://gitee.com/wang_li_pingping/mallmanagerinstall dependenciesnpm installserve with hot reload at localhost:8080npm run devbuild for production with minificationnpm run buildbuild for production and view the bundle a原创 2021-08-31 00:00:37 · 667 阅读 · 0 评论 -
axios接口请求封装以及跨域代理配置(简单基础配置,后续可按需封装)
axios接口请求封装以及跨域代理配置(简单基础配置,后续可按需封装)原生axios接口请求npm install axios--S新建axios封装js文件request.js并引入axiosimport axios from 'axios'request.js:import axios from 'axios'//创建一个axios对象const instance = axios.create({ baseURL:'/api',//会在发送请求时候拼接在url参数前面 ti原创 2021-08-11 11:20:00 · 3116 阅读 · 0 评论 -
vue-style-loader!css-loader报错解决方法
vue-style-loader!css-loader报错解决方法采用的yarn命令安装,npm安装可能还会报错(按需安装,不知道的全安装hhh)yarn add style-loader css-loader style-loaderyarn add less less-loaderyarn add sass sass-loader然后在仍然报错:可能是sass-loader版本太高,可修改为低版本7.3.1在package.json文件中修改"sass-loader": "^7.3.1原创 2021-08-10 13:23:39 · 2092 阅读 · 0 评论 -
计算属性和侦听属性(computed和watch)
计算属性和侦听属性(computed和watch)计算属性的应用(computed计算属性方法区)1、描述:表达式太复杂的情况会导致组件模板难以维护,而且多个地方使用到相同的表达式会导致重<template> <div> <!--表达式太复杂的情况会导致组件模板难以维护,而且多个地方使用到相同的表达式会导致重复--> <div> <!--type和msg的拼接表达式--> {{type + ":"原创 2021-08-08 14:57:37 · 198 阅读 · 0 评论 -
vue事件方法修饰符
vue事件方法子级阻止父级事件冒泡1、描述:在触发子集区方法时候父级方法会冒泡<template> <!--父组件--> <div> <div @click="fatherMethod"> 父级区 <div @click="childMethod">子级区</div> </div> </div></template><script>原创 2021-08-08 12:54:33 · 264 阅读 · 0 评论 -
前端Vue面试题积累(摘录)
前端Vue面试题积累(摘录)10个面试题:1、前端布局的几种方式2、element-ui中select下拉框加载大数据渲染优化3、说一说es6新特性有哪些4、怎样在一个HTML中嵌入另一个HTML页面(iframe标签用法)5、谈谈你对深拷贝和浅拷贝的理解。6、简要谈谈你对CommonJS规范的理解7、JS 中的require 和 import 区别8、Vue中用什么来循环数据9、vue-router的路由模式有哪几种,简要说一下。10、简单谈谈npm如何管理项目的依赖包的版本。答案转载 2021-08-07 13:17:11 · 328 阅读 · 0 评论 -
子组件向父组件传值
子组件向父组件传值子组件向父组件传值其实用的是$emit来触发父组件方法,父组件用v-on来绑定子组件触发的方法<template> <!--子组件--> <div> <div>子组件变化之后值传给父组件</div> <span>子组件值:</span><button @click="addChildTotal">{{num}}</button> </div>原创 2021-08-05 18:46:54 · 208 阅读 · 0 评论 -
父组件向子组件传值
父组件向子组件传值父组件向子组件传值即子组件通过props接收父组件传过来的值<template> <!--父组件--> <!--父组件向子组件传值--> <div> <childComponent :childValue = 'fatherValue'></childComponent> </div></template><script> import child原创 2021-08-05 18:00:13 · 1616 阅读 · 0 评论 -
v-for指令遍历数组、对象、对象数组区别(学习记录)
v-for指令遍历数据对象区别简单记录一下1、先看例子:v-for遍历对象和数组 <!--数组遍历--> <div v-for="(item,index) in arr" :key="index">{{index}}-{{item}}</div> <!--对象遍历--> <div v-for="(objValue,key,index) of obj" :key="index">{{index}}-{{key}}-{{objVa原创 2021-08-03 16:50:04 · 5152 阅读 · 0 评论