白聿冉-CSDN博客

微前端的概念是由ThoughtWorks在2016年提出的，它借鉴了微服务的架构理念，核心在于将一个庞大的前端应用拆分成多个独立灵活的小型应用，每个应用都可以独立开发、独立运行、独立部署，再将这些小型应用融合为一个完整的应用，或者将原本运行已久、没有关联的几个应用融合为一个应用。微前端既可以将多个项目融合为一，又可以减少项目之间的耦合，提升项目扩展性，相比一整块的前端仓库，微前端架构下的前端仓库倾向于更小更灵活。

2023-07-18 02:33:29 633

原创 vue3+vite+Ts 基于Antv/x6 绘制流程图

这里使用@antv/x6，基于vue3+vite+ts进行开发。实现一个流程图，双击可对相应的组件进行一些功能操作；

2023-07-10 16:31:05 2160

原创 Cesium.js基础使用（vue）

之后就可以访问高清页面；通过以下官网地址申请。

2023-07-04 01:08:49 4771 3

原创 Vue如何实现时间轴

该时间轴展示的是每条工程数据的鸟瞰图，照片可多张，利用el-carousel、el-image-viewer插件，走马灯效果，可图片预览；该时间轴每页最多默认展示三条数据，根据后台数据而定，超过三条前端分页处理；

2023-06-01 16:29:25 2348

原创文件阅览功能的实现(适用于word、pdf、Excel、ppt、png...)

func=to&_format=html&_cache=1&_xdoc=资料地址。_xdoc=资料地址。vue在线预览word、excel、pdf、txt、图片的相关资料,需要一个组件，同时能预览多种类型文件，一种类型文件可有多个的文件。之前看过各种博主的方案，其中最简单的是利用第三方进行预览解析；方法还是有很多的，下面给大家推荐几个还不错的网站；

2023-06-01 15:31:36 701

原创 el-select如何改变样式（:popper-append-to-body=“false“）

popper-append-to-body是一个Popper.js库的选项，用于指定Popper元素是否应该附加到文档的body元素上。通过Element-ui的Select Attributes可发现，有这样一个属性 popper-append-to-body。在使用el-select的时候，其样式会按照Elementui自带的默认样式为基准；.el-select-dropdown__item:hover——hover时的样式。.el-select-dropdown__item——单个选项的样式修改。

2023-06-01 14:20:00 5699

原创 Leaflet基本用法

Leaflet 还提供了让用户控制要渲染的图层的功能。使用该功能，我将在页面右上角添加一个选项菜单按钮，让您选择要覆盖在地图上的三个图层中的哪一个；添加切片图层，这将是 Leaflet 地图的基础图层。切片图层是通过服务器通过直接 URL 请求访问的一组切片。此切片图层将地理边界添加到地图中。将开始的json数据，在加载GeoJSON数据后，可以通过feature对象获取到各省份的信息，获取相应的地理JSON数据，用于对地图边界绘制。也可以添加多个矢量图层的选项。可点击对应区域使其标注。

2023-05-29 13:12:01 652

原创 css gap form表单自适应换行

【代码】form表单自适应换行居中css。

2023-05-16 21:50:23 174

原创如何解决使用scrollIntoView()导致页面上移

例如document.getElementById('BY').scrollIntoView()可使相应的目标盒子返回其顶部。在项目中，我们如果实现让指定盒子回到document顶部，可以使用scrollIntoView()方法，使用position:fixed;相对浏览器定位并且top:0;该方法解决了父元素位置偏差，直接相对于浏览器进行定位；使用该方法时，会让其最外层的盒子向上偏移；目前本人在开发过程中就遇到了类似问题；该方法虽然好用，但也有相应的弊端；目前只对谷歌和火狐浏览器兼容；

2023-05-15 22:09:21 1022

原创 element-ui中el-select如何实现删除多条分页

当数据改变时，会调用selection-change的方法，我们可以在这个方法上对数据进行操作。在多数PC端项目中，基本都是以element-ui为主使用table表格，此api需结合reserve-selection='true'使用。那么在处理不同页数的数据批量删除时，我们会遇到这样的问题。当我们选中第一页列表项后，去选择另外页码的数据，这时会发现我们之前选的第一页选中数据消失。在elementui文档其实有对应的api。这个方法用来返回对应选项的id；

2023-05-15 16:46:33 283

原创 Element-Ui中el-select选择后无法选中

由于Vue会在初始化实例时对属性执行getter/setter转换过程，所以属性必须在data中存在才能让vue转换它，这样才是响应式的，在我们开发项目过程中，多数情况下回用到element-ui中的select选择器，在开发过程中，会遇到这种情况，：使用Vue.js官方提供的vm.$forceUpdate()方法，该方法作用是迫使Vue实例重新渲染。具体来说就是在首次初始化之后，vue不会在进行加载渲染了，需要我们手动去执行渲染方法去重新加载它。受javascript的限制，vue。

2023-04-13 14:39:13 3039