vue
柒柒兮
随手记录工作中遇到的问题与解决方法,请大家多多指教
展开
-
vue3组件通信
这里利用之前封装的elementPlus 日期区间组件来讲一下vue3组件之间的通信父组件<v-date-picker @itemChange="getChangeTime"/>const getChangeTime = (e)=>{//获取子组件传过来的值 //e[0]:开始日期 //e[1]:结束日期}子组件接收vDatePicker.vue<template> <el-date-picker v-model="Times"原创 2021-12-10 14:17:45 · 844 阅读 · 0 评论 -
Vue3 的 setup 中使用 $refs
<template> <div class="container" ref="domRef"></div></template><script> import { ref,onMounted } from "vue"; export default { name: "footer", setup() { const domRef = ref(null) onMounted(() => { cons原创 2021-11-17 16:21:55 · 4044 阅读 · 0 评论 -
Vue3实现pc端商城购物车Demo
主要包含全选,店铺全选,反选,商品数量,价格计算数量加减使用的elementplus 中el-input-number组件<template> <div> <div class="goodsCart"> <div class="container"> <div class="tit"> 全部商品 </div> <div id="tree"> <div clas原创 2021-11-17 14:36:30 · 2117 阅读 · 1 评论 -
关于Vue使用Vant加载不到样式的问题
在项目根目录babel.config.js添加配置即可module.exports = { plugins: [ ['import', { libraryName: 'vant', libraryDirectory: 'es', style: true }, 'vant'] ]}原创 2021-08-23 10:54:41 · 1209 阅读 · 0 评论 -
Elementui el-upload 图片列表缩略图模式添加查看大图含删除功能
前言:由于官网el-upload 图片列表缩略图模式没有查看大图的功能,所有自己自定义了一个,其中很多投机取巧的方式,写的不好,若有更好的方法,请留言哦(▽),不多说废话,直接贴<template><el-upload class="upload-el" accept=".jpg,.png,.bmp" //限制上传的图片类型 :show-file-list="true" //是否显示已上传文件列表 multiple //设置多选 :limit="3" //最大允许上传个数原创 2021-08-04 15:25:39 · 5515 阅读 · 0 评论 -
蜂窝布局+背景切换,适合官网的特效
直接贴代码<template><div class="honeycomb-div"> <div class="wrap"> <ul> <li v-for="(item,index) in honeycombArr" :class="'a'+index" @mouseout="outBack" @mouseover="overBack(index)"> <原创 2021-08-03 15:28:51 · 435 阅读 · 0 评论 -
接收服务器返回的文件流并下载
下载或导出xlsxconst exportExcel =() =>{ proxy.$request({ url: 'api/export', method: 'POST', responseType: 'arraybuffer', data:{ //根据需求设置参数 } }).then(response => { let fileName = response.headers['content-dispos原创 2021-08-03 14:10:55 · 279 阅读 · 0 评论 -
Vue3+ElementUi el-table简单封装
前言:一次简单的封装,还不够完善,主要是根据自己的需求封装的。。。直接贴代码!第一步 vTable.vue<template> <el-table v-loading="config.loading" header-row-style="48px" height='580' border :class="{ 'table': '', 'noScrol': config.tableText }" ref="multipleTable"原创 2021-08-03 11:44:25 · 2132 阅读 · 0 评论