WebStorm使用Element组件库

文章目录

  • WebStorm使用Element组件库
    • 1. webstorm使用组件库
      • 1.1 webstorm使用vue文件
      • 1.2 首先需要安装Element Plus
    • 2. 项目完成引入---按钮组件
    • 3. 引入日历组件
    • 4. 引入走马灯组件
    • 5. image组件
      • 5.1 懒加载滚动
      • 5.2 大图预览
    • 6. Collapse 折叠面板手风琴组件
    • 8. Descriptions 描述列表

WebStorm使用Element组件库

1. webstorm使用组件库

1.1 webstorm使用vue文件

  • 在Test.vue文件中书写模板,并暴露对外接口
    在这里插入图片描述

    <script>
    export default {name: "Test"
    }
    </script><template><div><h1>Hello Vue</h1></div>
    </template><style scoped></style>
    
  • 在App.vue中使用

    在这里插入图片描述

  • 此时main.js不变

    import './assets/main.css'import { createApp } from 'vue'
    import App from './App.vue'createApp(App).mount('#app')
  • 页面效果:
    在这里插入图片描述

1.2 首先需要安装Element Plus

参考链接

  • 安装命令如下:
    npm install element-plus --save
    
    在webstorm命令窗口安装:在这里插入图片描述
  • 安装成功可以在package.json中查看是否安装成功;在这里插入图片描述

2. 项目完成引入—按钮组件

  • 使用button组件模板button-element.vue在这里插入图片描述

    <script>
    export default {name: "button-element"
    }
    </script><template><el-row><el-button>默认按钮</el-button><el-button type="primary">主要按钮</el-button><el-button type="success">成功按钮</el-button><el-button type="info">信息按钮</el-button><el-button type="warning">警告按钮</el-button><el-button type="danger">危险按钮</el-button></el-row><el-row><el-button plain>朴素按钮</el-button><el-button type="primary" plain>主要按钮</el-button><el-button type="success" plain>成功按钮</el-button><el-button type="info" plain>信息按钮</el-button><el-button type="warning" plain>警告按钮</el-button><el-button type="danger" plain>危险按钮</el-button></el-row><el-row><el-button round>圆角按钮</el-button><el-button type="primary" round>主要按钮</el-button><el-button type="success" round>成功按钮</el-button><el-button type="info" round>信息按钮</el-button><el-button type="warning" round>警告按钮</el-button><el-button type="danger" round>危险按钮</el-button></el-row><el-row><el-button icon="el-icon-search" circle></el-button><el-button type="primary" icon="el-icon-edit" circle></el-button><el-button type="success" icon="el-icon-check" circle></el-button><el-button type="info" icon="el-icon-message" circle></el-button><el-button type="warning" icon="el-icon-star-off" circle></el-button><el-button type="danger" icon="el-icon-delete" circle></el-button></el-row>
    </template><style scoped></style>
    
  • APP.vue中使用button-element.vue组件在这里插入图片描述

    <template><div>
    <!--    <test></test>-->
    <!--    <calendar></calendar>-->
    <!--    <component-a></component-a>-->
    <!--    <component-b></component-b>--><button-element></button-element></div>
    </template><script>
    import Test from "@/components/Test.vue";
    import Calendar from "@/components/calendar.vue";
    import ComponentA from "@/components/ComponentA.vue";
    import ComponentB from "@/components/ComponentB.vue";
    import ButtonElement from "@/components/button-element.vue";export default {name: 'App',components: {ButtonElement// ComponentB,// ComponentA,// Calendar,// Test}
    }
    </script><style lang="scss" scoped></style>
    
  • 需要修改main.js文件:导入并使用ElementPlus插件在这里插入图片描述

    import './assets/main.css'import ElementPlus from 'element-plus';
    import 'element-plus/theme-chalk/index.css';import { createApp } from 'vue'
    import App from './App.vue'createApp(App).use(ElementPlus).mount('#app')
    // createApp(App).mount('#app')
    

3. 引入日历组件

  • 需要修改main.js文件:导入并使用ElementPlus插件

    在这里插入图片描述

    import './assets/main.css'import ElementPlus from 'element-plus';
    import 'element-plus/theme-chalk/index.css';import { createApp } from 'vue'
    import App from './App.vue'createApp(App).use(ElementPlus).mount('#app')
  • 在calendar.vue直接使用官方给出的模板在这里插入图片描述

    <script>
    /*export default {name: "calendar"
    }*/
    export default {data() {return {value: new Date()}}
    }
    </script><template><el-calendar v-model="value"></el-calendar>
    </template><style scoped></style>
    
  • 在App.vue中使用后calendar.vue在这里插入图片描述

    	<template><div><!--    <test></test>--><calendar></calendar></div></template><script>import Test from "@/components/Test.vue";import Calendar from "@/components/calendar.vue";export default {name: 'App',components: {Calendar,// Test}}</script><style lang="scss" scoped></style>
    
  • 运行后即可在页面显示日历:

在这里插入图片描述

4. 引入走马灯组件

  • carrousel.vue在这里插入图片描述

    <script>
    //走马灯组件
    export default {name: "carrousel"
    }
    </script><template><el-carousel indicator-position="outside"><el-carousel-item v-for="item in 4" :key="item"><h3>{{ item }}</h3></el-carousel-item></el-carousel>
    </template><style scoped>
    .el-carousel__item h3 {color: #475669;font-size: 18px;opacity: 0.75;line-height: 300px;margin: 0;
    }.el-carousel__item:nth-child(2n) {background-color: #99a9bf;
    }.el-carousel__item:nth-child(2n+1) {background-color: #d3dce6;
    }
    </style>
    
  • App.vue在这里插入图片描述

    <template><div>
    <!--    <test></test>-->
    <!--    <calendar></calendar>-->
    <!--    <component-a></component-a>-->
    <!--    <component-b></component-b>-->
    <!--    <button-element></button-element>--><carrousel></carrousel></div>
    </template><script>
    import Test from "@/components/Test.vue";
    import Calendar from "@/components/calendar.vue";
    import ComponentA from "@/components/ComponentA.vue";
    import ComponentB from "@/components/ComponentB.vue";
    import ButtonElement from "@/components/button-element.vue";
    import Carrousel from "@/components/carrousel.vue";export default {name: 'App',components: {Carrousel// ButtonElement// ComponentB,// ComponentA,// Calendar,// Test}
    }
    </script><style lang="scss" scoped></style>
    
  • main.js在这里插入图片描述

    import './assets/main.css'import ElementPlus from 'element-plus';
    import 'element-plus/theme-chalk/index.css';import { createApp } from 'vue'
    import App from './App.vue'createApp(App).use(ElementPlus).mount('#app')
    // createApp(App).mount('#app')
  • 页面效果:点击左右箭头会滑动在这里插入图片描述
    在这里插入图片描述

5. image组件

5.1 懒加载滚动

可通过lazy开启懒加载功能,当图片滚动到可视范围内才会加载。可通过scroll-container来设置滚动容器,若未定义,则为最近一个overflow值为auto或scroll的父元素。

  • image-element.vue

    <script>
    export default {name: "image-element",data() {return {urls: ['https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg','https://fuss10.elemecdn.com/1/34/19aa98b1fcb2781c4fba33d850549jpeg.jpeg','https://fuss10.elemecdn.com/0/6f/e35ff375812e6b0020b6b4e8f9583jpeg.jpeg','https://fuss10.elemecdn.com/9/bb/e27858e973f5d7d3904835f46abbdjpeg.jpeg','https://fuss10.elemecdn.com/d/e6/c4d93a3805b3ce3f323f7974e6f78jpeg.jpeg','https://fuss10.elemecdn.com/3/28/bbf893f792f03a54408b3b7a7ebf0jpeg.jpeg','https://fuss10.elemecdn.com/2/11/6535bcfb26e4c79b48ddde44f4b6fjpeg.jpeg']}}
    }
    </script><template><!--    可通过lazy开启懒加载功能,当图片滚动到可视范围内才会加载。
    可通过scroll-container来设置滚动容器,若未定义,则为最近一个overflow值为auto或scroll的父元素。--><div id="app"><div class="demo-image__lazy"><el-image v-for="url in urls" :key="url" :src="url" lazy></el-image></div></div> 
    </template><style scoped></style>
    
  • App.vue

    <template><div>
    <!--    <test></test>-->
    <!--    <calendar></calendar>-->
    <!--    <component-a></component-a>-->
    <!--    <component-b></component-b>-->
    <!--    <button-element></button-element>-->
    <!--    <carrousel></carrousel>--><image-element></image-element></div>
    </template><script>
    import Test from "@/components/Test.vue";
    import Calendar from "@/components/calendar.vue";
    import ComponentA from "@/components/ComponentA.vue";
    import ComponentB from "@/components/ComponentB.vue";
    import ButtonElement from "@/components/button-element.vue";
    import Carrousel from "@/components/carrousel.vue";
    import ImageElement from "@/components/image-element.vue";export default {name: 'App',components: {ImageElement// Carrousel// ButtonElement// ComponentB,// ComponentA,// Calendar,// Test}
    }
    </script><style lang="scss" scoped></style>
    
  • main.js

    import './assets/main.css'import ElementPlus from 'element-plus';
    import 'element-plus/theme-chalk/index.css';import { createApp } from 'vue'
    import App from './App.vue'createApp(App).use(ElementPlus).mount('#app')
    // createApp(App).mount('#app')
  • 运行结果:可以通过滑块滑动

在这里插入图片描述

5.2 大图预览

可通过 previewSrcList 开启预览大图的功能

  • image-previewSrcList.vue

    <script>
    export default {name: "image-previewSrcList",data() {return {url: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',srcList: ['https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg','https://fuss10.elemecdn.com/1/34/19aa98b1fcb2781c4fba33d850549jpeg.jpeg','https://fuss10.elemecdn.com/0/6f/e35ff375812e6b0020b6b4e8f9583jpeg.jpeg','https://fuss10.elemecdn.com/9/bb/e27858e973f5d7d3904835f46abbdjpeg.jpeg','https://fuss10.elemecdn.com/d/e6/c4d93a3805b3ce3f323f7974e6f78jpeg.jpeg','https://fuss10.elemecdn.com/3/28/bbf893f792f03a54408b3b7a7ebf0jpeg.jpeg','https://fuss10.elemecdn.com/2/11/6535bcfb26e4c79b48ddde44f4b6fjpeg.jpeg']}}
    }
    </script><template><div class="demo-image__preview"><el-imagestyle="width: 100px; height: 100px":src="url":preview-src-list="srcList"></el-image></div>
    </template><style scoped></style>
    
  • App.vue

    <template><div>
    <!--    <test></test>-->
    <!--    <calendar></calendar>-->
    <!--    <component-a></component-a>-->
    <!--    <component-b></component-b>-->
    <!--    <button-element></button-element>-->
    <!--    <carrousel></carrousel>-->
    <!--    <image-element></image-element>--><image-previewSrcList></image-previewSrcList></div>
    </template><script>
    import Test from "@/components/Test.vue";
    import Calendar from "@/components/calendar.vue";
    import ComponentA from "@/components/ComponentA.vue";
    import ComponentB from "@/components/ComponentB.vue";
    import ButtonElement from "@/components/button-element.vue";
    import Carrousel from "@/components/carrousel.vue";
    import ImageElement from "@/components/image-element.vue";
    import ImagePreviewSrcList from "@/components/image-previewSrcList.vue";export default {name: 'App',components: {ImagePreviewSrcList// ImageElement// Carrousel// ButtonElement// ComponentB,// ComponentA,// Calendar,// Test}
    }
    </script><style lang="scss" scoped></style>
    
  • main.js

    import './assets/main.css'import ElementPlus from 'element-plus';
    import 'element-plus/theme-chalk/index.css';import { createApp } from 'vue'
    import App from './App.vue'createApp(App).use(ElementPlus).mount('#app')
    // createApp(App).mount('#app')
  • 页面效果:点击图片会进入大图预览,可通过左右箭头翻

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

6. Collapse 折叠面板手风琴组件

Collapse.vue

<script>
export default {name: "Collapse",data() {return {activeName: '1'};}
}
</script><template><div><el-collapse v-model="activeName" accordion><el-collapse-item title="一致性 Consistency" name="1"><div>与现实生活一致:与现实生活的流程、逻辑保持一致,遵循用户习惯的语言和概念;</div><div>在界面中一致:所有的元素和结构需保持一致,比如:设计样式、图标和文本、元素的位置等。</div></el-collapse-item><el-collapse-item title="反馈 Feedback" name="2"><div>控制反馈:通过界面样式和交互动效让用户可以清晰的感知自己的操作;</div><div>页面反馈:操作后,通过页面元素的变化清晰地展现当前状态。</div></el-collapse-item><el-collapse-item title="效率 Efficiency" name="3"><div>简化流程:设计简洁直观的操作流程;</div><div>清晰明确:语言表达清晰且表意明确,让用户快速理解进而作出决策;</div><div>帮助用户识别:界面简单直白,让用户快速识别而非回忆,减少用户记忆负担。</div></el-collapse-item><el-collapse-item title="可控 Controllability" name="4"><div>用户决策:根据场景可给予用户操作建议或安全提示,但不能代替用户进行决策;</div><div>结果可控:用户可以自由的进行操作,包括撤销、回退和终止当前操作等。</div></el-collapse-item></el-collapse></div>
</template><style scoped></style>

App.vue

<template><div>
<!--    <test></test>-->
<!--    <calendar></calendar>-->
<!--    <component-a></component-a>-->
<!--    <component-b></component-b>-->
<!--    <button-element></button-element>-->
<!--    <carrousel></carrousel>-->
<!--    <image-element></image-element>-->
<!--    <image-previewSrcList></image-previewSrcList>-->
<!--    <nav-menu></nav-menu>--><collapse></collapse></div>
</template><script>
import Test from "@/components/Test.vue";
import Calendar from "@/components/calendar.vue";
import ComponentA from "@/components/ComponentA.vue";
import ComponentB from "@/components/ComponentB.vue";
import ButtonElement from "@/components/button-element.vue";
import Carrousel from "@/components/carrousel.vue";
import ImageElement from "@/components/image-element.vue";
import ImagePreviewSrcList from "@/components/image-previewSrcList.vue";
import NavMenu from "@/components/navMenu.vue";
import Collapse from "@/components/Collapse.vue";export default {name: 'App',components: {Collapse// NavMenu// ImagePreviewSrcList// ImageElement// Carrousel// ButtonElement// ComponentB,// ComponentA,// Calendar,// Test}
}
</script><style lang="scss" scoped></style>

main.js

import './assets/main.css'import ElementPlus from 'element-plus';
import 'element-plus/theme-chalk/index.css';import { createApp } from 'vue'
import App from './App.vue'createApp(App).use(ElementPlus).mount('#app')
// createApp(App).mount('#app')

页面效果:点击每个分组会实现手风琴效果
在这里插入图片描述
在这里插入图片描述

8. Descriptions 描述列表

Descriptions.vue

<script>
//¶Descriptions 描述列表
export default {name: "Descriptions",data () {return {size: ''};}
}
</script><template><el-radio-group v-model="size"><el-radio label="">默认</el-radio><el-radio label="medium">中等</el-radio><el-radio label="small">小型</el-radio><el-radio label="mini">超小</el-radio></el-radio-group><el-descriptions class="margin-top" title="带边框列表" :column="3" :size="size" border><template slot="extra"><el-button type="primary" size="small">操作</el-button></template><el-descriptions-item><template slot="label"><i class="el-icon-user"></i>用户名</template>kooriookami</el-descriptions-item><el-descriptions-item><template slot="label"><i class="el-icon-mobile-phone"></i>手机号</template>18100000000</el-descriptions-item><el-descriptions-item><template slot="label"><i class="el-icon-location-outline"></i>居住地</template>苏州市</el-descriptions-item><el-descriptions-item><template slot="label"><i class="el-icon-tickets"></i>备注</template><el-tag size="small">学校</el-tag></el-descriptions-item><el-descriptions-item><template slot="label"><i class="el-icon-office-building"></i>联系地址</template>江苏省苏州市吴中区吴中大道 1188</el-descriptions-item></el-descriptions><el-descriptions class="margin-top" title="无边框列表" :column="3" :size="size"><template slot="extra"><el-button type="primary" size="small">操作</el-button></template><el-descriptions-item label="用户名">kooriookami</el-descriptions-item><el-descriptions-item label="手机号">18100000000</el-descriptions-item><el-descriptions-item label="居住地">苏州市</el-descriptions-item><el-descriptions-item label="备注"><el-tag size="small">学校</el-tag></el-descriptions-item><el-descriptions-item label="联系地址">江苏省苏州市吴中区吴中大道 1188</el-descriptions-item></el-descriptions>
</template><style scoped></style>

App.vue

<template><div>
<!--    <test></test>-->
<!--    <calendar></calendar>-->
<!--    <component-a></component-a>-->
<!--    <component-b></component-b>-->
<!--    <button-element></button-element>-->
<!--    <carrousel></carrousel>-->
<!--    <image-element></image-element>-->
<!--    <image-previewSrcList></image-previewSrcList>-->
<!--    <nav-menu></nav-menu>-->
<!--    <collapse></collapse>--><descriptions></descriptions></div>
</template><script>
import Test from "@/components/Test.vue";
import Calendar from "@/components/calendar.vue";
import ComponentA from "@/components/ComponentA.vue";
import ComponentB from "@/components/ComponentB.vue";
import ButtonElement from "@/components/button-element.vue";
import Carrousel from "@/components/carrousel.vue";
import ImageElement from "@/components/image-element.vue";
import ImagePreviewSrcList from "@/components/image-previewSrcList.vue";
import NavMenu from "@/components/navMenu.vue";
import Collapse from "@/components/Collapse.vue";
import Descriptions from "@/components/Descriptions.vue";export default {name: 'App',components: {Descriptions// Collapse// NavMenu// ImagePreviewSrcList// ImageElement// Carrousel// ButtonElement// ComponentB,// ComponentA,// Calendar,// Test}
}
</script><style lang="scss" scoped></style>

页面效果:展示描述列表,上面的选择框可选列表显示大小
在这里插入图片描述

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

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

相关文章

代理HTTP使用不当会出现哪些问题?如何正确使用代理服务?

代理HTTP是一种常见的网络代理方式&#xff0c;它为客户端和服务器之间提供中间层&#xff0c;转发上下游的请求和响应。正确使用代理HTTP可以提高采集效率、增加网络安全性、加速网络速度、保护用户隐私。但是&#xff0c;使用不当就难以达到预期的效果&#xff0c;在使用代理…

Linux使用docker安装elasticsearch-head

一、elasticsearch-head的安装启动 #下载镜像 docker pull alivv/elasticsearch-head #启动 docker run -d --name eshead -p 9100:9100 alivv/elasticsearch-head 查看日志 docker logs -f eshead 出现如下证明启动成功 浏览器访问9100端口&#xff0c;出现以下页面也说明启动…

芯科蓝牙BG27开发笔记8-片上Flash读写

目标 熟悉片上Flash的特点&#xff0c;知道如何使用&#xff0c;最好找到示例代码&#xff0c;有完整例程那是最好的 查找参考手册 除了768K的主空间&#xff0c;还包含&#xff1a; 1. USERDATA区域&#xff0c;用户定义数据&#xff0c;可以读写。大小只有1K。 2. 设备特…

国际版腾讯云/阿里云:全站加快有哪些功用?有哪些优势?适用于什么场景?

腾讯云全站加快有哪些功用&#xff1f;有哪些优势&#xff1f;适用于什么场景&#xff1f; 产品功用 全站加快 ECDN 经过在全球各区域部署加快节点&#xff0c;有用下降跨国拜访推迟&#xff0c;保证全球加快作用。 最优链路 各加快节点两两相连&#xff0c;实时勘探&#xff0…

初识操作系统

1.操作系统的概念 操作系统(Operating System&#xff0c;OS&#xff09;是指控制和管理整个计算机系统的硬件和软件资源&#xff0c;并合理地组织调度计算机的工作和资源的分配; 以提供给用户和其他软件方便的接口和环境; 它是计算机系统中最基本的系统软件。 操作系统的特…

1-FPGA硬件加速-YUV_YCbCr

这是对《基于Matlab与FPGA的图像处理教程》的学习笔记&#xff0c;代码和内容摘取自书中。 心得&#xff1a; 使用FPGA进行硬件加速的重点是消除或者减少浮点数运算&#xff0c;转换为定点运算&#xff0c;然后通过pipeline流水设计转为并行实现加速。 原理和方法 RGB与&…

【Spring面试】四、Bean的生命周期、循环依赖、BeanDefinition

文章目录 Q1、Bean有哪些生命周期回调方法&#xff1f;有哪几种实现方式&#xff1f;Q2、Spring在加载过程中Bean有哪几种形态Q3、解释下Spring框架中Bean的生命周期Q4、Spring是如何解决Bean的循环依赖的Q5、Spring是如何帮我们在并发下避免获取不完整的Bean的&#xff1f;Q6、…

基于springboot+vue的大学生智能消费记账系统

博主主页&#xff1a;猫头鹰源码 博主简介&#xff1a;Java领域优质创作者、CSDN博客专家、公司架构师、全网粉丝5万、专注Java技术领域和毕业设计项目实战 主要内容&#xff1a;毕业设计(Javaweb项目|小程序等)、简历模板、学习资料、面试题库、技术咨询 文末联系获取 项目介绍…

【电源专题】案例:异常样机为什么只在40%以下电量时与其他样机显示电量差异10%,40%以上电量差异却都在5%以内。

本案例发生在一个量产产品的测试中,因为产品带电池,所以需要测试产品对于电池电量显示的精确程度。产品使用的是最简单的开路电压查表法进行设计。 案例测试报告的问题在于不同样机之间电量百分比存在差异,大部分是在3%~4%之间。但在7.2V电压时,能够差异10%左右。 在文章:…

ESIM实战文本匹配

引言 今天我们来实现ESIM文本匹配&#xff0c;这是一个典型的交互型文本匹配方式&#xff0c;也是近期第一个测试集准确率超过80%的模型。 我们来看下是如何实现的。 模型架构 我们主要实现左边的ESIM网络。 从下往上看&#xff0c;分别是 输入编码层(Input Ecoding) 对前…

【Android知识笔记】进程通信(二)

一、Binder对象是如何跨进程传递的 binder传递有哪些方式?binder在传递过程中是怎么存储的?binder对象序列化和反序列化过程?binder对象传递过程中驱动层做了什么?总结 Binder 对象的跨进程传递主要靠 Parcel 的两个关键方法 writeStrongBinder() 和

nvm 一个nodejs版本管理工具

nvm 一个nodejs版本管理工具 NVM是什么 nvm全英文也叫node.js version management&#xff0c;是一个nodejs的版本管理工具。nvm和n都是node.js版本管理工具&#xff0c;为了解决node.js各种版本存在不兼容现象可以通过它可以安装和切换不同版本的node.js NVM下载 可在点此在…

vueshowpdf 移动端pdf文件预览

1、安装 npm install vueshowpdf -S2、参数 属性说明类型默认值v-model是否显示pdf--pdfurlpdf的文件地址String- scale 默认放大倍数 Number1.2 minscale 最小放大倍数 Number0.8 maxscale 最大放大倍数 Number2 3、事件 名称说明回调参数closepdf pdf关闭事件-pdferr文…

jmeter接口测试及详细步骤以及项目实战教程

在接口测试项目实战中&#xff0c;JMeter是一款非常强大和流行的自动化测试工具&#xff0c;它可以测试各种类型的应用程序&#xff0c;并通过采样和报告来识别性能瓶颈和API的问题。本文将为你提供一个基于实际项目的JMeter接口测试项目实战教程&#xff0c;指导你如何使用JMe…

潍坊科技学院图书馆藏《乡村振兴战略下传统村落文化旅游设计》许少辉八一新书

潍坊科技学院图书馆藏《乡村振兴战略下传统村落文化旅游设计》许少辉八一新书

金融行业的软件测试分析

随着金融行业的业务不断增加&#xff0c;金融交易模式的不断变化&#xff0c;金融机构对信息化的要求也越来越高&#xff0c;高质量的金融软件对于金融机构来说显得尤为重要。如何保证金融行业软件的质量&#xff0c;对金融行业软件的测试人员来说&#xff0c;也提出了更高的要…

Python进阶教学——多线程高级应用

目录 一、线程间的通讯机制 二、线程中的消息隔离机制 三、线程同步信号量 四、线程池和进程池 一、线程间的通讯机制 1、Queue消息队列 消息队列是在消息的传输过程中保存消息的容器&#xff0c;主要用于不同线程间任意类型数据的共享。消息队列最经典的用法就是消费者和…

Lua脚本

基本语法 注释 print(“script lua win”) – 单行注释 – [[ 多行注释 ]] – 标识符 类似于&#xff1a;java当中 变量、属性名、方法名。 以字母&#xff08;a-z,A-Z&#xff09;、下划线 开头&#xff0c;后面加上0个或多个 字母、下划线、数字。 不要用下划线大写字母…

变压器寿命预测(python代码,Logistic Regression模型预测效果一般,可以做对比实验)

1.数据来源官网&#xff1a;Data for: Root cause analysis improved with machine learning for failure analysis in power transformers - Mendeley Data 点Download All 10kb即可下载数据 2.下载下来后是这样 每一列的介绍&#xff1a; Hydrogen 氢气&#xff1b; Oxyge…

01目标检测-问题引入

目录 一、目标检测问题定义 二、目标检测过程中的常见的问题 三、目标检测VS图像分类区别 目标检测&#xff1a; 图像分类&#xff1a; 总结&#xff1a; 四、目标检测VS目标分割 目标分割&#xff1a; 目标检测是计算机视觉领域的一个重要任务&#xff0c;旨在从图像或…