猴子都会我不会-CSDN博客

原创兄弟组件之间怎么使用bus传值

1.首先在main.js注册bus// busconst bus = new Vue()Vue.prototype.$bus = buswindow.$bus = bus2.使用$emit传递值this.$bus.$emit('approve', true)3.使用$on接收(接收的时候尽量在mounted里面接收,不然有可能会出问题) mounted() { this.$bus.$on('approve', (msg) => { this.approve =

2021-05-26 10:46:12 263

原创 vue项目表格下载

downExcel() { this.$http({ url: '你的url地址', method: 'post', data: { //你的参数 proId: '', type: '', }, responseType: 'blob', }).then((res) => { console.log('下载', res)

2021-05-23 09:42:39 100

原创 ES6的冷门小知识,一起学起来叭

1.数组的flat方法(将多维数组转成扁平数组)…展开运算符(合并),原来不仅可以合并数组还可以合并对象呐!!!惊不惊喜,意不意外!!!new Set(去重)3.Object.keys()对象的方法用于获取对象自身所有可枚举的属性效果类似于for…in4.Object.values()对象的方法5.数组的实例方法includes当判断条件这么多的时候,一个个往后排是不是很low,这个时候includes的强大之处就要体现出来了6.可选链操作符?. 会用不如果obj为undefi

2022-07-14 15:18:05 202 1

原创小程序对比2个数组的id,给id相同的对象增加属性(适用于反向查询)

我的项目需求是后端返给我一个checkbox列表(全部的值),还反了应该被选中的列表给我,此时我需要把第二个数组的值在checkbox上打√,效果如下

2022-06-22 16:38:07 898

原创小程序自定义实现多选单选功能

实现多选功能 <view bindtap="checkPortHandler" class="item {{item.ischeck?'g-bg-color white-color':''}}" data-index="{{index}}" data-item="{{item}}" wx:for="{{checkPortList}}" wx:key="index">{{item.name

2022-05-30 13:59:28 431

原创 for循环改变数组(把后端返的时间变成几小时前分钟前几天前)

import {getDetailTime} from '../../../utils/util.js'//获取聊天记录 async getMessage() { const res = await App.$api.WxRequest('xxxxxxxxxxxxx', 'GET', { toMemberId: this.data.toMemberId, fromMemberId: this.data.fromMemberId, }) console.l

2021-10-12 10:27:06 213

原创 ant design vue使用表格跳转到详情页在返回怎么能保留在当前页

1.在详情页返回的时候带一个参数过来(区分我是从上一页返回过来的) back() { // this.$router.go(-1); this.$router.push({ path: "/home/user", query:{ source:1 } }); },2.在列表页定义一个current,同时双向绑定current pagination: { current: 1

2021-08-13 10:10:37 1756

原创 vue弹窗组件的使用(传值),以及弹窗只能触发一次的解决办法

1.父组件引入并注册子组件import BusinessDialog from '../../components/BusinessDialog'export default { components: { BusinessDialog }, data() { return { dialog:false; }; },2.在父组件中使用子组件 <business-dialog :dialog.sync="dialog"></bus

2021-06-08 14:29:06 4596 1

原创 vue项目优化之开发环境下移除console

1.安装一个插件（babel-plugin-transform-remove-console）在项目build阶段移除所有的console信息npm install babel-plugin-transform-remove-console --save-dev2.打开babel.config.js，编辑代码如下：const productPlugins = []//判断是开发还是发布阶段if(process.env.NODE_ENV === 'production'){ //发布阶段

2021-05-28 10:06:12 336

原创 offset和size作为参数的分页该怎么请求(内含element ui的滚动式分页v-infinite-scroll)

//这是data中的数据 pageIndex: 0, pageSize: 10,async getDataList() { this.loading = true let params = { size: this.pageSize, offSet: this.pageSize * this.pageIndex, describe: this.describe ? this.describe : '', }

2021-05-18 17:09:27 450

原创 pc端怎么做input框只输入数字校验

<el-input οninput="value=value.replace(/[^\d]/g,'')" placeholder="请输入奖金金额如:300" v-model="publicParams.bonusMoney" @blur="publicParams.bonusMoney = $event.target.value" > </el-...

2021-05-07 11:55:09 168

原创安装并使用vuex

1.安装:npm i vuex2.新建文件夹store / store.jsimport Vue from "vue"import Vuex from "vuex" Vue.use(Vuex); export default new Vuex.Store({ state:{ /*state里面存储的都是公共的数据*/ source: 0, //存的值 }, mutations:{ // state 就是上面那个state

2021-05-06 10:28:12 75

转载 ES6 数组方法 --- map() filter() find() every() some()的用法

map()输出结果：（3）[2,4,6]可以发现，是不是必须要创建一个空数组？而使用map()就不需要。那么 .map() 是怎么运行的呢？实际上对数组的每个元素都遍历一次(就不用写forEach自己去遍历了)，同时返回一个新的值。记住一点是返回的这个数据的长度和原始数组长度是一致的。值得注意的是：必须要加return，否则返回的是undefined2.filter()假如你有一个数组，你只想要这个数组中的一些元素怎么办呢？这时候 .filter() 就非常好用了。来看几个例子吧!

2021-05-05 15:47:59 570 3

原创 vue项目中使用腾讯地图(亲测好用)

1.一定要先申请一个腾讯地图的KEY(自行百度)2.引入地图(key=“就是你申请的key啦”)<script src="https://map.qq.com/api/gljs?v=1.exp&key=ZADBZ-*********-NWO5Z-IVFV5"></script>3.准备一个容器,用来存放地图的<div class="container" id="mapContainer" style="width:800px;height:400px;"&gt

2021-03-26 11:36:14 4099 1

原创 vue后端返回的二维码流怎么转成base64展示在页面上

1.先准备好img标签 <img class="ewm-img" :src="imgurl" alt="" />2.请求二维码的接口，一定写明请求的类型responseType: "blob",对，就这个一定要加上 getCode() { http({ url: "你的请求路径", method: "get", responseType: "blob", }).then((res) => { .

2021-02-27 11:55:53 1519

原创 Element ui导航栏选中背景色刷新消失的解决方法

<el-menu :is-collapse="isCollapse" text-color="#fff" active-text-color="#fff" :default-active="activerouter" :router="true" ></el-menu> //重点在于:default-active="activerouter"的设置1.activerouter 挂在d.

2021-02-27 11:48:06 1560

原创教你小程序wx.navigateBack()怎么传参数?

现在是A页面返回B页面这里是A.js文件 // getCurrentPages是获取页面栈 let pages = getCurrentPages() console.log('当前pages',pages) // 获取上一界面的页面内容 let perPage = pages[pages.length - 2] console.log('上一个perPage',perPage) // 执行上个页面的方法 perPage.returnBackCouponIn

2020-12-24 11:55:12 905

原创小程序实现仿微信图片裁切功能

详细链接:https://developers.weixin.qq.com/community/develop/doc/000ac078a40410da8ce7be33c56c06组件GitHub 地址https://github.com/yunlzhang/miniprogram-cropper-component1.先把组件下载下来放入项目的component文件夹中2.在需要使用该组件的页面注册该组件在该目录的json文件中引入组件 index.json3.在该目录的wxml文件中使

2020-12-17 15:10:18 365

weixin_46414427的博客