戴草帽的太阳-CSDN博客

目前这种流式布局主要应用于图片展示，用css、flex方法来实现的居多，但这些仅适用于固定数据，并不适用于本项目中的动态数据（即列数、每列高度均不定的情况）实现流式布局。【背景】由于项目需求中遇到一个 ‘更多菜单’ 中的布局需要用到瀑布流布局，特地去了解了下什么是瀑布流布局？从第二行开始，每一个容器都要放在第一行容器高度最小的下方，以此类推。小编通过结合其实现原理封装了一个用js实现动态数据流式布局的组件。瀑布流的特点：即等宽不等高。

2023-03-11 21:40:01 1047

原创 VUE WangEditor 配置图片上传至服务器

功能需求：在我的实际项目中因wangEditor默认的图片上传的存储方式是base64存储，会导致上传后的图片太大，所以需配置上传本地服务器wangEditor版本：4.7.9话不多说直接上代码：<template> <div> <el-form ref="form" :model="form" label-width="150px"> <el-form-item label="文本内容" prop="content" class="con

2022-03-01 11:58:55 3147

原创 VUE 如何隐藏高德地图vue-amap左下角的logo

情景描述在我的项目中，引用了高德地图api，在页面展示上需要隐藏掉左下角的logo，尝试过很多博主提供的方法，未果，最后找到了解决方案解决方案：在我项目中，自定义封装了地图组件(具体看我上一篇文章)，直接在该文件中设置样式即可<style lang="scss" scoped>::v-deep .amap-logo { display: none; opacity: 0 !important;}::v-deep .amap-copyright { opacity: 0

2021-11-19 15:19:48 2264 2

原创 VUE使用【高德地图】vue-amap自定义封装组件带搜索功能及回显标记功能

vue-amap的使用情景描述：1.点击查看按钮弹出弹框显示地图，搜索地址后地图上进行选点获取经纬度、省市地区等信息，点击确定按钮关闭弹窗将获取到的信息填入表单2.在表单已有经纬度数据时点击按钮地图根据经纬度信息回显标记到相应位置效果如图：地图搜索选点点击确定将信息填入表单step1.安装 npm install --save vue-amapstep2.main.js中引入配置// 全局组件高德地图import VueAMap from 'vue-amap'Vue.use(VueA

2021-11-19 14:56:01 4465 1

原创踩坑指南——VUE项目前端使用SM3国密加密

使用场景：在我的项目中，甲方要求系统登录时对密码进行加密后再传给后端，指定使用国密SM3，在这个过程中使用了很多种方法，最终总结出最简单的一种方法，如下：操作步骤：1.先在项目中使用npm命令安装依赖npm install --save sm-crypto2.页面中部分代码<template>//密码框部分<el-form-item prop="password"> <el-input :key="passwordTyp

2021-09-02 14:47:40 8563 3

原创踩坑指南——前端处理vue项目在页面上点击下载文件名乱码问题

遇到的问题：在网页中点击链接下载下来的文件名字不是原本的文件名，打开文件后内容正常的。之前在网站上也参考过很多其他博主的解决方案，试了好几种都没效果上代码：页面上的片段由于使用el-link直接下载，再点击下载时会出现闪屏的情况，所以就绑定了一个事件来解决这个问题 <el-table-column prop="url" header-align="center" label="附件" :show-overflow-tooltip="true"> &

2021-08-25 18:40:44 3486 3

原创踩坑指南——Vue element admin 自带的富文本编辑器Tinymce语言设置

问题：菜单栏等内容默认为英文状态在此之前也看了很多博主的方法，但经本人实际验证无效，方法实际是没问题的，但漏掉了一步最关键的修改操作如下：由于我的项目使用的是vue-element-admin,默认在src/main.js中就注册使用了elementui组件，所以此步骤省略1.文件路径:：src/components/Tinymce/index.vue2.文件路径：src/store/getters.js3.文件路径：src/store/modules/app.js最终修改效果如下：

2021-07-02 16:31:00 1149 4

原创 VUE利用provide和inject实现页面局部刷新功能

功能需求：点击刷新时，路由保持在当前路由，不会t跳回到首页，当前路由下的页面局部刷新实现原理：利用vue的provide和inject，它们成对出现，作用于父组件向子孙组件传递数据，provide在父组件中返回要传给下级的数据，inject在需要使用这个数据的子组件等下级组件中注入数据。代码如下：步骤1.先在APP.vue中修改<template> <div id="app"> <router-view v-if="isRouterActive" /&gt

2021-06-22 10:54:04 741

原创 VUE ElementUI中table框设置文字超出隐藏及设置提示框样式

当表格中某单元格的文字内容过多时，table中的每行的行高不一致导致风格不统一，这时需要用到ElementUI中table自带的属性show-overflow-tooltip使其内容均在一行显示，超出部分隐藏，鼠标移上去显示提示框，效果如下：<el-table-column prop="description" label="模板说明" width="400" :show-overflow-tooltip="true"

2021-06-03 15:47:22 6654 3

原创踩坑指南——elementUI中el-switch开关点击弹出确认框时，状态先改变，点击确认/取消失效，怎么解决??

需求：点击开关时，原来的状态不改变，弹出确认框，选择确认：状态改变；取消：保持原状踩坑案例：原因：v-model的数据双向绑定原理，点击开关时状态就以实时改变怎么解决？如下（针对此案例）只需将v-model改成:value="",再手动赋值即可（代码修改部分）<template slot-scope="scope"> //修改前:v-model="scope.row.templateState" <el-switch

2021-06-01 15:59:36 7446 1

weixin_47447250的博客

原创三级网络技术——第十一章网络管理技术

原创三级网络技术——第十章网络安全技术

原创三级网络技术——第九章计算机网络环境及应用系统的安装与管理

原创三级网络技术——第八章无线局域网设备安装与调试

原创三级网络技术——第七章路由器的配置及使用

原创三级网络技术——第六章交换机及其配置

原创三级网络技术——第五章局域网技术基础及应用

原创三级网络技术——第四章路由设计技术基础

原创三级网络技术——第三章 IP地址规划技术

原创三级网络技术——第二章中小型网络系统总体规划与设计

原创 Macbook m2安装node版本控制工具

原创【零基础】网络技术三级考过分享+知识点整理

原创计算IP地址聚合后可用地址数——计算机三级网络技术

原创【VUE】用js实现动态数据流式布局