qq_58340302的博客

场景：el-table设置了height属性，但是切换查询条件后再次点击查询重新获取data时，el-table渲染的高度会有问题，滚动区域变矮了。方法‌，在表格数据渲染后调用。方法可以重新布局表格。

需求：实现点击获取经纬度、定位、对特殊位置标点及自定义信息窗体功能。

之前也写过其他限制日期的语句，感觉用dayjs()的subtract()和add()也挺方便易懂的，以此记录。

1、安装插件，npm install element-resize-detector。方法：使用element-resize-detector插件来实现。

场景：图片地址找不到时，会展示如图一；虽然没什么大影响，但是有点丑，需求是想在图片损坏时展示替补图片，如图二。代码实现：给img标签加@error=""事件。

场景：多图片时，下载成一个zip压缩包文件。

这里处理的都是，预览后端返回的文件地址url。

在做h5项目中的聊天页面时，需求是进入页面自动滚到底部，方便用户看到最新消息（因为消息是正序排列的，最新消息自然展示在底部）。

npm install vue-i18n@next 这样装的最新版的才能在vue3.0使用。问题：地址栏语言的传参变换后，页面的展示的数据还是翻译的上一个语言的数据，需要再次刷新才正确。场景：我这里做的不是点击按钮切换语言，是从地址栏里取不同的语言时需要更新数据。结果：页面渲染的数据就是当前地址栏取到的语言所对应的翻译数据。

虽然elementui 里 el-table 有一个属性可以很好的实现：给el-table-column 加 show-overflow-tooltip 属性，可以使列表里的内容超出隐藏并展示气泡框；2、判断字符长度：如果内容的长度大于设置的长度就气泡框展示，但这样会因英文或特殊符号与中文的宽度不等，导致判断不精准，出现不打点也会出现气泡框。1、直接使用tooltip：但这样就会出现，无论一行能不能展示全，都会出现气泡框，显然不符合需求。在开发中遇到一个这种需求：内容超出一行打点...，且气泡框展示。

将用户输入的数据转换成number，否则虽然你输入的是数字，但它的类型其实是String，比如在数字输入框时很有用。

在做项目时我们经常会遇到用一个弹窗表单来实现新增和编辑两个功能，这样就会出现，先点击编辑，回显出来的数据，再下一次点击新增时也会存在，所以我们需要在打开弹窗时清除数据。使用this.$options.data()

在上传图片时，手里的图片尺寸有时会不符合上传标准，此时就需要一个上传前可以手动裁剪图片的功能。

1、在vue项目中utils文件夹中新建文件formatTime.js。2、在main.js文件中引入。

图片上传的尺寸限制

之前写的复制功能发现用微信打开的浏览器页面不生效，所以又换了种方法实现首先，安装 clipboardnpm install clipboard --save然后，引入 clipboardimport Clipboard from 'clipboard'对被点击的文本或按钮绑定动态变量id="btn" :data-clipboard-text="scope.row.courseNo"<!-- 这里scope.row.courseNo是我要复制的内容 --><.

有时候对于table表格中的数据需要单选时，则需要改造一下elementui中的多选功能首先，给el-table 添加属性：<el-table :data="addData" ref="multipleTable" tooltip-effect="dark" @selection-change="handleSelectionChange" @select-all="dialogCheck" @select="dialogCheck">然后，再met

// tableData是所有的数据// checkl是需要选中的数据// id是每条数据的唯一值this.tableData.forEach(row => { this.checkl?.forEach(rows => { if (row.id === rows.id) { this.$refs.multipleTable.toggleRowSelection(row, true) } })})如果要实现分页多选，保持数据的选中状态给e...

解决办法：1、针对少一个月的，加上下面两句：value-format=“yyyy-MM” // 被绑定的值就自动转换为yyyy-MM格式format=“yyyy-MM” // 改变选择器显示的格式<el-date-picker v-model="searchData.month" type="month" placeholder="2012-6" format="yyyy-MM" value-format="yyyy-MM" :picker-o

问题场景：想要点击菜单时，该菜单显示不同的颜色效果给el-menu 组件加了active-text-color 属性后，效果基本可以<el-menu...text-color="#fff"active-text-color="#409EFF">...</el-menu>如下图：但是， 当我手动更改了路由，跳转到另一个页面时，他的高亮显示并没有随之改变所以，这个不好的体验得修修解决办法：拿到当前...

功能：点击按钮或者文本可以复制对应的数据百度到了document.execCommand，结果发现这个现在已经废弃了。然后就发现了另一个解决办法 navigator.clipboard.writeText(val)，具体如下：// 先给要复制的文本或者按钮加上点击事件后，并将要复制的值传过来async copyValue(val) { try { await navigator.clipboard.writeText(val);// val就是要复制的值.

要实现上传文件时只限制图片，对el-upload加两条属性就可以实现accept="image/jpg,image/jpeg,image/png" // 接受上传的文件类型:before-upload="handleBeforeUpload" //上传之前的钩子 类型：function(file)如果只添加第一行代码，虽然可以让用户在点击上传按钮时，视线范围内只会出现符合图片格式的文件，但是...但是，当用户点击右下角选择“所有文件”时，就会看到非图片格式的文件，这样用户......

vue中的指令按照不同的用途可以分为如下6大类：- 内容渲染指令- 属性绑定指令- 事件绑定指令- 双向绑定指令- 条件渲染指令- 列表渲染指令