Spring Cloud学习(十)【Elasticsearch搜索功能 分布式搜索引擎02】

文章目录

  • DSL查询文档
    • DSL查询分类
    • 全文检索查询
    • 精准查询
    • 地理坐标查询
    • 组合查询
      • 相关性算分
      • Function Score Query
      • 复合查询 Boolean Query
  • 搜索结果处理
    • 排序
    • 分页
    • 高亮
  • RestClient查询文档
    • 快速入门
    • match查询
    • 精确查询
    • 复合查询
    • 排序、分页、高亮
  • 黑马旅游案例


DSL查询文档

DSL查询分类

DSL Query的分类

Elasticsearch提供了基于JSON的DSL(Domain Specific Language)来定义查询。常见的查询类型包括:

  • 查询所有:查询出所有数据,一般测试用。例如:match_all
  • 全文检索(full text)查询:利用分词器对用户输入内容分词,然后去倒排索引库中匹配。例如:
    • match_query
    • multi_match_query
  • 精确查询:根据精确词条值查找数据,一般是查找keyword、数值、日期、boolean等类型字段。例如:
    • ids
    • range
    • term
  • 地理(geo)查询:根据经纬度查询。例如:
    • geo_distance
    • geo_bounding_box
  • 复合(compound)查询:复合查询可以将上述各种查询条件组合起来,合并查询条件。例如:
    • bool
    • function_score

查询的基本语法如下:

在这里插入图片描述

查询DSL的基本语法是什么?

  • GET /索引库名/_search
  • { “query”: { “查询类型”: { “FIELD”: “TEXT”}}}

全文检索查询

全文检索查询,会对用户输入内容分词,常用于搜索框搜索:

在这里插入图片描述

match 查询:全文检索查询的一种,会对用户输入内容分词,然后去倒排索引库检索,语法:

在这里插入图片描述

multi_match:与 match 查询类似,只不过允许同时查询多个字段,语法:

在这里插入图片描述

matchmulti_match 的区别是什么?

  • match:根据一个字段查询
  • multi_match:根据多个字段查询,参与查询字段越多,查询性能越差

精准查询

精确查询一般是查找keyword、数值、日期、boolean等类型字段。所以不会对搜索条件分词。常见的有:

  • term:根据词条精确值查询
  • range:根据值的范围查询

在这里插入图片描述

精确查询常见的有 term 查询和 range 查询。语法如下:

term查询:					range查询:

精确查询常见的有哪些?

  • term查询:根据词条精确匹配,一般搜索keyword类型、数值类型、布尔类型、日期类型字段
  • range查询:根据数值范围查询,可以是数值、日期的范围

地理坐标查询

根据经纬度查询。常见的使用场景包括:

  • 携程:搜索我附近的酒店
  • 滴滴:搜索我附近的出租车
  • 微信:搜索我附近的人

在这里插入图片描述
根据经纬度查询,官方文档。例如:

  • geo_bounding_box:查询geo_point值落在某个矩形范围的所有文档

在这里插入图片描述

根据经纬度查询,官方文档。例如:

  • geo_distance:查询到指定中心点小于某个距离值的所有文档

在这里插入图片描述

组合查询

复合(compound)查询:复合查询可以将其它简单查询组合起来,实现更复杂的搜索逻辑,例如:

  • fuction score:算分函数查询,可以控制文档相关性算分,控制文档排名。例如百度竞价

在这里插入图片描述

相关性算分

当我们利用match查询时,文档结果会根据与搜索词条的关联度打分(_score),返回结果时按照分值降序排列。
例如,我们搜索 “虹桥如家”,结果如下:

在这里插入图片描述
在这里插入图片描述

elasticsearch中的相关性打分算法是什么?

  • TF-IDF:在elasticsearch5.0之前,会随着词频增加而越来越大
  • BM25:在elasticsearch5.0之后,会随着词频增加而增大,但增长曲线会趋于水平

Function Score Query

使用 function score query,可以修改文档的相关性算分(query score),根据新得到的算分排序。

在这里插入图片描述

案例: 给“如家”这个品牌的酒店排名靠前一些

把这个问题翻译一下,function score需要的三要素:

  1. 哪些文档需要算分加权?
  • 品牌为如家的酒店
  1. 算分函数是什么?
  • weight就可以
  1. 加权模式是什么?
  • 求和

在这里插入图片描述
function score query定义的三要素是什么?

  • 过滤条件:哪些文档要加分
  • 算分函数:如何计算function score
  • 加权方式:function score 与 query score如何运算

复合查询 Boolean Query

布尔查询是一个或多个查询子句的组合。子查询的组合方式有:

  • must:必须匹配每个子查询,类似“与”
  • should:选择性匹配子查询,类似“或”
  • must_not:必须不匹配,不参与算分,类似“非”
  • filter:必须匹配,不参与算分

在这里插入图片描述
在这里插入图片描述

利用bool查询实现功能

需求:搜索名字包含“如家”,价格不高于400,在坐标31.21,121.5周围 10km 范围内的酒店。

在这里插入图片描述

bool查询有几种逻辑关系?

  • must:必须匹配的条件,可以理解为“与”
  • should:选择性匹配的条件,可以理解为“或”
  • must_not:必须不匹配的条件,不参与打分
  • filter:必须匹配的条件,不参与打分

搜索结果处理

排序

elasticsearch支持对搜索结果排序,默认是根据相关度算分(_score)来排序。可以排序字段类型有:keyword类型、数值类型、地理坐标类型、日期类型等。

在这里插入图片描述

分页

elasticsearch 默认情况下只返回top10的数据。而如果要查询更多数据就需要修改分页参数了。
elasticsearch中通过修改from、size参数来控制要返回的分页结果:

在这里插入图片描述

深度分页问题

ES是分布式的,所以会面临深度分页问题。例如按price排序后,获取from = 990,size =10的数据:

  1. 首先在每个数据分片上都排序并查询前1000条文档。
  2. 然后将所有节点的结果聚合,在内存中重新排序选出前1000条文档
  3. 最后从这1000条中,选取从990开始的10条文档

如果搜索页数过深,或者结果集(from + size)越大,对内存和CPU的消耗也越高。因此ES设定结果集查询的上限是10000

在这里插入图片描述

针对深度分页,ES提供了两种解决方案,官方文档:

  • search after:分页时需要排序,原理是从上一次的排序值开始,查询下一页数据。官方推荐使用的方式。
  • scroll:原理将排序数据形成快照,保存在内存。官方已经不推荐使用。

from + size:

  • 优点:支持随机翻页
  • 缺点:深度分页问题,默认查询上限(from + size)是10000
  • 场景:百度、京东、谷歌、淘宝这样的随机翻页搜索

after search:

  • 优点:没有查询上限(单次查询的size不超过10000)
  • 缺点:只能向后逐页查询,不支持随机翻页
  • 场景:没有随机翻页需求的搜索,例如手机向下滚动翻页

scroll:

  • 优点:没有查询上限(单次查询的size不超过10000)
  • 缺点:会有额外内存消耗,并且搜索结果是非实时的
  • 场景:海量数据的获取和迁移。从ES7.1开始不推荐,建议用 after search方案。

高亮

高亮:就是在搜索结果中把搜索关键字突出显示。

原理是这样的:

  • 将搜索结果中的关键字用标签标记出来
  • 在页面中给标签添加css样式

语法:

在这里插入图片描述
在这里插入图片描述
搜索结果处理整体语法:

GET /hotel/_search
{"query": {"match": {"name": "如家"}},"from": 0, // 分页开始的位置"size": 20, // 期望获取的文档总数"sort": [ {  "price": "asc" }, // 普通排序{"_geo_distance" : { // 距离排序"location" : "31.040699,121.618075", "order" : "asc","unit" : "km"}}],"highlight": {"fields": { // 高亮字段"name": {"pre_tags": "<em>",  // 用来标记高亮字段的前置标签"post_tags": "</em>" // 用来标记高亮字段的后置标签}}}
}

RestClient查询文档

快速入门

我们通过 match_all 来演示下基本的 API ,先看请求 DSL 的组织:

在这里插入图片描述

我们通过 match_all 来演示下基本的 API,再看结果的解析:

在这里插入图片描述

@Test
void testMatchAll() throws IOException {// 1. 准备RequestSearchRequest request = new SearchRequest("hotel");// 2. 准备DSLrequest.source().query(QueryBuilders.matchAllQuery());// 3. 发送请求SearchResponse response = client.search(request, RequestOptions.DEFAULT);// 4. 解析响应SearchHits searchHits = response.getHits();// 4.1 获取总条数long total = searchHits.getTotalHits().value;System.out.println("共搜索到" + total + "条数据");// 4.2 文档数组SearchHit[] hits = searchHits.getHits();// 4.3 遍历for (SearchHit hit : hits) {// 获取文档sourceString json = hit.getSourceAsString();// 反序列化HotelDoc hotelDoc = JSON.parseObject(json, HotelDoc.class);System.out.println("hotelDoc = " + hotelDoc);}System.out.println(response);
}

RestAPI 中其中构建 DSL 是通过 HighLevelRestClient 中的 resource() 来实现的,其中包含了查询、排序、分页、高亮等所有功能:

在这里插入图片描述

RestAPI 中其中构建查询条件的核心部分是由一个名为 QueryBuilders 的工具类提供的,其中包含了各种查询方法:

在这里插入图片描述

查询的基本步骤是:

  1. 创建SearchRequest对象
  2. 准备Request.source(),也就是DSL。
    QueryBuilders来构建查询条件
    传入Request.source() 的 query() 方法
  3. 发送请求,得到结果
  4. 解析结果(参考 JSON 结果,从外到内,逐层解析)

match查询

全文检索查询

全文检索的 matchmulti_match 查询与 match_all 的API基本一致。差别是查询条件,也就是 query 的部分。
同样是利用 QueryBuilders 提供的方法:

在这里插入图片描述

精确查询

精确查询常见的有term查询和range查询,同样利用QueryBuilders实现:

在这里插入图片描述

复合查询

复合查询-boolean query

精确查询常见的有 term 查询和 range 查询,同样利用 QueryBuilders 实现:

在这里插入图片描述

要构建查询条件,只要记住一个类:QueryBuilders

排序、分页、高亮

排序、分页

搜索结果的排序和分页是与query同级的参数,对应的API如下:

在这里插入图片描述

高亮

高亮API包括请求DSL构建和结果解析两部分。我们先看请求的DSL构建:

在这里插入图片描述

高亮的结果处理相对比较麻烦:

在这里插入图片描述

  • 所有搜索DSL的构建,记住一个API:SearchRequest的source()方法。
  • 高亮结果解析是参考JSON结果,逐层解析
// 4. 解析响应
SearchHits searchHits = response.getHits();
// 4.1 获取总条数
long total = searchHits.getTotalHits().value;
System.out.println("共搜索到" + total + "条数据");
// 4.2 文档数组
SearchHit[] hits = searchHits.getHits();
// 4.3 遍历
for (SearchHit hit : hits) {// 获取文档 sourceString json = hit.getSourceAsString();// 反序列化HotelDoc hotelDoc = JSON.parseObject(json, HotelDoc.class);// 获取高亮结果Map<String, HighlightField> highlightFields = hit.getHighlightFields();if(!CollectionUtils.isEmpty(highlightFields)){// 根据字段名称获取高亮结果HighlightField highlightField = highlightFields.get("name");if(highlightField != null){// 获取高亮值String name = highlightField.getFragments()[0].string();// 覆盖非高亮结果hotelDoc.setName(name);}}System.out.println("hotelDoc = " + hotelDoc);
}

黑马旅游案例

案例1:实现黑马旅游的酒店搜索功能,完成关键字搜索和分页

我们课前提供的hotel-demo项目中,自带了前端页面,启动后可以看到:

在这里插入图片描述

先实现其中的关键字搜索功能,实现步骤如下:

  1. 定义实体类,接收前端请求
  2. 定义controller接口,接收页面请求,调用IHotelService的search方法
  3. 定义IHotelService中的search方法,利用match查询实现根据关键字搜索酒店信息

步骤1:定义类,接收前端请求参数

在这里插入图片描述

步骤2:定义controller接口,接收前端请求

定义一个HotelController,声明查询接口,满足下列要求:

  • 请求方式:Post
  • 请求路径:/hotel/list
  • 请求参数:对象,类型为RequestParam
  • 返回值:PageResult,包含两个属性
    Long total:总条数
    List hotels:酒店数据

步骤3:在IHotelService中定义一个方法,实现搜索功能

  1. 在IHotelService中定义一个方法,声明如下:

在这里插入图片描述

  1. 在HotelService中实现该方法,满足下列要求:
    利用match查询,根据参数中的key搜索all字段,查询酒店信息并返回
    利用参数中的page、size实现分页

案例2:添加品牌、城市、星级、价格等过滤功能

需求效果如图:

在这里插入图片描述

步骤:

  1. 修改RequestParams类,添加brand、city、starName、minPrice、maxPrice等参数
  2. 修改search方法的实现,在关键字搜索时,如果brand等参数存在,对其做过滤

步骤一:拓展IUserService的search方法的参数列表

修改RequestParams类,接收所有参数:

在这里插入图片描述

步骤二:修改search方法,在match查询基础上添加过滤条件

过滤条件包括:

  • city精确匹配
  • brand精确匹配
  • starName精确匹配
  • price范围过滤

注意事项:

  • 多个条件之间是AND关系,组合多条件用BooleanQuery
  • 参数存在才需要过滤,做好非空判断

案例3:我附近的酒店

前端页面点击定位后,会将你所在的位置发送到后台:

在这里插入图片描述

我们要根据这个坐标,将酒店结果按照到这个点的距离升序排序。
实现思路如下:

  • 修改RequestParams参数,接收location字段
  • 修改search方法业务逻辑,如果location有值,添加根据geo_distance排序的功能

距离排序

距离排序与普通字段排序有所差异,API如下:

在这里插入图片描述

按照距离排序后,还需要显示具体的距离值:

在这里插入图片描述

案例4:让指定的酒店在搜索结果中排名置顶

我们给需要置顶的酒店文档添加一个标记。然后利用function score给带有标记的文档增加权重。

实现步骤分析:

  1. 给HotelDoc类添加isAD字段,Boolean类型
  2. 挑选几个你喜欢的酒店,给它的文档数据添加isAD字段,值为true
  3. 修改search方法,添加function score功能,给isAD值为true的酒店增加权重

在这里插入图片描述

组合查询-function score

Function Score查询可以控制文档的相关性算分,使用方式如下:

在这里插入图片描述

给黑马旅游添加排序功能

在这里插入图片描述

前端会传递sortBy参数,就是排序方式,我们需要判断sortBy值是什么:

  • default:相关度算分排序,这个不用管,es的默认排序策略
  • score:根据酒店的score字段排序,也就是用户评价,降序
  • price:根据酒店的price字段排序,就是价格,升序

给黑马旅游添加搜索关键字高亮效果

前端已经给<em>标签写好CSS样式了。我们只需要负责服务端高亮即可。

在这里插入图片描述

RequestParams

@Data
public class RequestParams {private String key;private Integer page;private Integer size;private String sortBy;private String city;private String brand;private String starName;private Integer minPrice;private Integer maxPrice;private String location;
}

PageResult.java

@Data
public class PageResult {private Long total;private List<HotelDoc> hotels;public PageResult(Long total, List<HotelDoc> hotels) {this.total = total;this.hotels = hotels;}public PageResult() {}
}

HotelService.java

@Service
public class HotelService extends ServiceImpl<HotelMapper, Hotel> implements IHotelService {@Autowiredprivate RestHighLevelClient client;@Overridepublic PageResult search(RequestParams params) {try {// 1. 准备 RequestSearchRequest request = new SearchRequest("hotel");// 2. 准备 DSL// 2.1 querybuildBasicQuery(params, request);// 2.2 分页int page = params.getPage();int size = params.getSize();request.source().from((page - 1) * size).size(size);// 2.3 排序String location = params.getLocation();if (location != null && !"".equals(location)){request.source().sort(SortBuilders.geoDistanceSort("location", new GeoPoint(location)).order(SortOrder.ASC).unit(DistanceUnit.KILOMETERS));}// 3. 发送请求,得到响应SearchResponse response = client.search(request, RequestOptions.DEFAULT);// 4. 解析响应return handleResponse(response);} catch (IOException e) {throw new RuntimeException(e);}}private void buildBasicQuery(RequestParams params, SearchRequest request) {// 1. 构建BooleanQueryBoolQueryBuilder boolQuery = QueryBuilders.boolQuery();// 关键字搜索String key = params.getKey();if(key == null || "".equals(key)){boolQuery.must(QueryBuilders.matchAllQuery());}else{boolQuery.must(QueryBuilders.matchQuery("all", key));}// 条件过滤// 城市条件if (params.getCity() != null && !params.getCity().equals("")){boolQuery.filter(QueryBuilders.termQuery("city", params.getCity()));}// 品牌条件if (params.getBrand() != null && !params.getBrand().equals("")){boolQuery.filter(QueryBuilders.termQuery("brand", params.getBrand()));}// 星级条件if (params.getStarName() != null && !params.getStarName().equals("")){boolQuery.filter(QueryBuilders.termQuery("starName", params.getBrand()));}// 价格if (params.getMinPrice() != null && params.getMaxPrice() != null){boolQuery.filter(QueryBuilders.rangeQuery("price").gte(params.getMinPrice()).lte(params.getMaxPrice()));}// 2. 算分控制FunctionScoreQueryBuilder functionScoreQuery = QueryBuilders.functionScoreQuery(// 原始查询,相关性算分查询boolQuery,// function score 的数组new FunctionScoreQueryBuilder.FilterFunctionBuilder[]{// 其中的一个 function score 元素new FunctionScoreQueryBuilder.FilterFunctionBuilder(// 过滤条件QueryBuilders.termQuery("isAD", true),// 算分函数ScoreFunctionBuilders.weightFactorFunction(10))});request.source().query(functionScoreQuery);}private PageResult handleResponse(SearchResponse response){// 4. 解析响应SearchHits searchHits = response.getHits();// 4.1 获取总条数long total = searchHits.getTotalHits().value;System.out.println("共搜索到" + total + "条数据");// 4.2 文档数组SearchHit[] hits = searchHits.getHits();// 4.3 遍历ArrayList<HotelDoc> hotels = new ArrayList<>();for (SearchHit hit : hits) {// 获取文档 sourceString json = hit.getSourceAsString();// 反序列化HotelDoc hotelDoc = JSON.parseObject(json, HotelDoc.class);// 获取排序值Object[] sortValues = hit.getSortValues();if (sortValues.length > 0){Object sortValue = sortValues[0];hotelDoc.setDistance(sortValue);}hotels.add(hotelDoc);}// 封装返回return new PageResult(total, hotels);}
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/149918.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

QT day3作业

1.思维导图 2、 完善对话框&#xff0c;点击登录对话框&#xff0c;如果账号和密码匹配&#xff0c;则弹出信息对话框&#xff0c;给出提示”登录成功“&#xff0c;提供一个Ok按钮&#xff0c;用户点击Ok后&#xff0c;关闭登录界面&#xff0c;跳转到其他界面 如果账号和密…

不懂找伦敦银趋势?3个方法搞定

趋势是我们的朋友&#xff0c;但是这个朋友却很喜欢跟我们开玩笑&#xff0c;如果我们不留意&#xff0c;根本发觉不了它的存在。怎么找到趋势本体并且和它做个好朋友呢&#xff1f;下面我们就来介绍三个方法。 数波段的高点和低点。我们以当前的市场波动价格为轴&#xff0c;向…

IDEA中更换java项目JDK

我们打开IDEA 打开项目 然后选择 File 下的 Project Structure 这里 我们下拉选择自己需要的JDK Sources这里 也要设置一下JDK对应版本 然后 上面这个 Project 中 也要设置一下对应jdk的版本 保持一直 然后 我们打开 File 下的 Settings 然后 找到如下图配置 如果JKD版本看…

深度学习人体语义分割在弹幕防遮挡上的实现 - python 计算机竞赛

文章目录 1 前言1 课题背景2 技术原理和方法2.1基本原理2.2 技术选型和方法 3 实例分割4 实现效果5 最后 1 前言 &#x1f525; 优质竞赛项目系列&#xff0c;今天要分享的是 &#x1f6a9; 深度学习人体语义分割在弹幕防遮挡上的应用 该项目较为新颖&#xff0c;适合作为竞…

Unity Meta Quest 一体机开发(七):配置玩家 Hand Grab 功能

文章目录 &#x1f4d5;教程说明&#x1f4d5;玩家物体配置 Hand Grab Interactor⭐添加 Hand Grab Interactor 物体⭐激活 Hand Grab Visual 和 Hand Grab Glow⭐更新 Best Hover Interactor Group &#x1f4d5;配置可抓取物体&#xff08;无抓取手势&#xff09;⭐刚体和碰撞…

DDPM的学习

Denoising Model 首先是宏观理解一下 Denoising Model 的输入 去噪很多步&#xff0c;用的是同一个Denoising Model&#xff0c;但是输入图片可能差距很大。解决方法&#xff1a;给Denoising Model多输入一个变量&#xff0c;表示现在的去噪阶段&#xff0c;让Denoising Mod…

解决requests 2.28.x版本SSL错误:证书验证失败

1、问题背景 在使用requests 2.28.1版本时&#xff0c;我进行HTTP post传输报告负载时&#xff0c;由于SSL验证设置为True&#xff0c;请求失败&#xff0c;错误如下&#xff1a;(Caused by SSLError(SSLCertVerificationError(1, ‘[SSL: CERTIFICATE_VERIFY_FAILED] certifi…

ChatGPT最强?文心一言与ChatGPT对比

对于同一个问题我们分别对文心一言3.5和ChatGPT3.5输出回答&#xff0c;结果如下图&#xff0c;可以看到文心一言的回答更好&#xff0c;文心一言是由百度开发的人工智能语言模型&#xff0c;它的中文理解能力主要是基于百度强大的搜索引擎和自然语言处理技术。文心一言更加注重…

mysql优化之explain 以及 索引优化

Mysql安装文档参考&#xff1a;https://blog.csdn.net/yougoule/article/details/56680952 Explain工具介绍 使用EXPLAIN关键字可以模拟优化器执行SQL语句&#xff0c;分析你的查询语句或是结构的性能瓶颈 在 select 语句之前增加 explain 关键字&#xff0c;MySQL 会在查询上设…

非关系型数据库Redis(缓存型数据库)

关系型数据库和非关系型数据库的区别 关系型数据库 是一个结构化的数据库&#xff0c;记录方式是行&#xff08;记录对象属性&#xff09;和列&#xff08;声明对象&#xff09; 表与表之间是有关联的&#xff0c;使用sql语句来对指定的表、库进行增删改查 在创建表的时候&…

hive sql 行列转换 开窗函数 炸裂函数

hive sql 行列转换 开窗函数 炸裂函数 准备原始数据集 学生表 student.csv 讲师表 teacher.csv 课程表 course.csv 分数表 score.csv 员工表 emp.csv 雇员表 employee.csv 电影表 movie.txt 学生表 student.csv 001,彭于晏,1995-05-16,男 002,胡歌,1994-03-20,男 003,周杰伦,…

Flutter 中数据存储的四种方式

在 Flutter 中&#xff0c;存储是指用于本地和远程存储和管理数据的机制。以下是 Flutter 中不同存储选项的概述和示例。 Shared Preferences&#xff08;本地键值存储&#xff09; Shared Preferences 是一种在本地存储少量数据&#xff08;例如用户首选项或设置&#xff09…

buildadmin+tp8表格操作(7.1)表格的事件监听(el-table中的事件)

因为buildAdmin是封装的 el-table的组件&#xff0c;所以el-table中的事件&#xff0c; 也是可以使用的&#xff0c; 两者有几个事件是有共同的&#xff08;比如 双击事件&#xff09;&#xff0c; 这时可以根据自己的需要自行选择 以下代码是 buildadmin 使用 el-table中的事…

用公式告诉你 现货黄金投资者要不要换策略?

看过笔者相关文章的朋友都知道&#xff0c;其实笔者是相当不鼓励投资者更改策略的。但这并不意味着&#xff0c;策略不能改或者换。之所以反对更改策略&#xff0c;是因为很多人对自己的策略还没上手&#xff0c;没了解清楚就急着换策略&#xff0c;这是没必要的。通过下面这个…

Vuex 组件间通讯

组件间通讯 Vuex https://vuex.vuejs.org/zh/ 基本原理 数据提取到父级 // index 文件 import Vue from vue import Vuex from "vuex" import tab from ./tab // 引入 modulesVue.use(Vuex) // 全局引入// 创建 Vuex 实例 export default new Vuex.Store({modules: …

iPaaS和RPA,企业自动化应该如何选择?

全球著名的咨询调查机构Gartner在2022年初再次发布了《2022年12大技术趋势》报告。 Gartner是全球最具权威的IT研究与顾问咨询公司&#xff0c;成立于1979年&#xff0c;在界定及分析那些决定了商业进程的发展趋势与技术方面&#xff0c;它拥有二十年以上的丰富经验&#xff0c…

uniapp-轮播图点击预览功能

实现效果 点击后打开预览图 实现代码 <swiper v-if"this.bannerList.length > 1" class"swiper" autoplay"true" duration"500" interval"2000" change"changeSwiper"><swiper-item class"swip…

Web之JavaScript(jQuery)笔记

Web之HTML、CSS、JavaScript 三、JavaScriptJS调试变量自定义函数数据类型及转换运算符优先级内置函数数组事件DOM(Document Object Model 文档对象模型)jQuery Web之HTML笔记 Web之CSS笔记 三、JavaScript JavaScript&#xff08;简称“JS”&#xff09;是一种轻量级的面向对…

element-ui中怎样使用iconfont的图标

1 登录 https://www.iconfont.cn/ 2 搜索合适的图 这里可以找到这个图所在的图库。这样就可以一次查找到对应的所有同款图标 3 选择同款加入购物车 4 将购物车的icon加入项目&#xff0c;注意是新建项目&#xff0c;除非你是确定需要前面已经加过的icon 5 下载icon 选择fon…

麒麟系统安装找不到安装源!!!!设置基础软件仓库时出错

记录--华为RH2288 V3服务器安装麒麟系统遇到的问题 1.遇到的问题--“设置基础软件仓库时出错”报错导致无法继续安装 没办法下一步 先说结论&#xff1a;系统bug 该问题在CentOS、Rocky Linux最新版中均存在 解决&#xff1a; &#xff08;一&#xff09;、如果是外网直接配…