分类：UI

2022
04-07

本地jvm执行flink程序带web ui的操作

目录本地jvm执行flink带webui使用Flink本地执行入门一、maven依赖二、本地执行三、实例本地jvm执行flink带webui使用StreamExecutionEnvironmentexecutionEnvironment=StreamExecutionEnvironment.getExecutionEnvironment();可以获取flink执行环境。但是本地jvm执行的时候是不带webui的。有时候出于监控的考虑，需要带着监控页面查看。任务运行状况，可以使用下面方式获取flink本地执行环境，并带有webui。Configurationc... 继续阅读 >

2021
09-28

vue+element ui实现锚点定位

本文实例为大家分享了vue+elementui实现锚点定位的具体代码，供大家参考，具体内容如下vue<el-row:gutter="20"><el-col:span="3"><!--导航选择事件--><el-menu:default-active="activeStep"@select="jump"><el-menu-itemv-for="(item,index)inmenuData":index="`${index}`":key="item.subjectId"><iclass="el-icon-menu"></i><spanslot="title">{{item.subjectName}}</span></el-... 继续阅读 >

2021
08-10

Unity UI实现拖拽旋转

本文实例为大家分享了UnityUI实现拖拽旋转的具体代码，供大家参考，具体内容如下跟随鼠标旋转第一种效果是跟随鼠标旋转，原理是计算下鼠标位置与拖拽物体的相对位移旋转方向即可注意转换对应空间坐标新建脚本mono类继承IBeginDragHandler,IDragHandler,IEndDragHandler接口[SerializeField]privateCanvasm_Canvas;privateVector3?CalculateWorldToScreenPos(Vector3worldPos){if(m_Canvas.ren... 继续阅读 >

2021
07-04

Vue Element UI自定义描述列表组件

本文实例为大家分享了VueElementUI自定义描述列表组件的具体代码，供大家参考，具体内容如下效果图写在前面写后台管理经常从列表点击查看详情，展示数据信息，ElementUI虽然有表格组件，但是描述组件并没有，之前团队的成员遇到这种情况都自己去写样式，写起来也麻烦，而且每个人写出来的样式也不统一，破坏了项目的整体风格。像是AntDesignUI就有描述组件，用起来特别舒服，所以索性自己结合ElementUI的el-row和el-col自己... 继续阅读 >

2021
03-05

vue3.0中使用element的完整步骤

前言：      在vue3.0中使用element框架，因为element是支持vue2.0的，他推出的支持vue3.0的版本叫 element-plus官网入口：点我进入一、个人遇到的问题与解决办法：遇到的问题：我直接用cnpm i element-plus -S装的版本，不知道为啥，一直报错图1，版本型号图2，我的代码中使用图3解决办法：我把package.json中的element-plus的版本更换成  下面这句话，解决... 继续阅读 >

2020
12-14

vue使用element-ui实现表单验证

本文实例为大家分享了vue使用element-ui实现表单验证的具体代码，供大家参考，具体内容如下一、简单逻辑验证（直接使用rules）实现思路html中给el-form增加:rules="rules"html中在el-form-item中增加属性prop="名称"js中直接在data中定义rules:{}html部分<el-formref="form":rules="rules":model="form"label-width="300px"><el-form-itemlabel="发货地址："prop="fAdderss"><el-inputclass="inp"v-model="fo... 继续阅读 >

2020
11-17

解决vue-cli输入命令vue ui没效果的问题

最近用vue-cli脚手架很顺口，特别是UI控制台，在这里，创建项目和搭建本地环境，连接服务端变得很容易，页面ui也是一流要怎么启动呢？在终端输入命令行vueui，启动UI控制台，然后往浏览器输入终端报出的链接输入命令行vueui，终端会报启动信息，这本来很正常。可是呢，今天不知道啥回事，输入vueui，终端没反应我查看了vue的帮助信息，敢情是根本没有‘vueui'这一命令行！怎么回事？vue版本怎么倒退了！于是重新安装vue-cli... 继续阅读 >

2020
11-16

vue+Element-ui实现登录注册表单

本文实例为大家分享了vue+Element-ui实现登录注册表单的具体代码，供大家参考，具体内容如下登录注册表单验证通过Element-ui的表单实现登录注册的表单验证效果图如下注册登录表单登录的实现，需要通过手机号或者邮箱进行登录,验证手机号或者邮箱符合要求//登录表单验证的代码//template的代码<el-form:model="ruleForm":rules="rules"ref="ruleForm"label-width="100px"class="demo-ruleForm"><el-form-ite... 继续阅读 >

2020
11-16

Vue+Element-U实现分页显示效果

本文实例为大家分享了Vue+Element-U实现分页显示效果的具体代码，供大家参考，具体内容如下当我们从后端返回的数据量很大，并且根据需求我们需要将返回的数据全部都显示在页面中，默认情况下会把所有的数据全部显示在一个页面，这样非常影响视觉和页面的使用，所以需要使用分页我这次使用的是Vue4.0+ Element-UI组件，Element-UI库非常的丰富，它提供了一个分页组件Pagination展示效果：这个是获取两个时间段的上机记录HTM... 继续阅读 >

2020
11-16

vue+Element-ui前端实现分页效果

本文实例为大家分享了vue+Element-ui前端实现分页效果的具体代码，供大家参考，具体内容如下分页技术分页技术的概念分页就是将所有的数据分段展示给用户，用户看到的可能不是全部的数据，而是其中一部分，用户可以通过点击页码来查找自己需要的内容，也可以通过模糊查询获取符合内容的数据分页的意义分页确实有效,但它一定会加大系统的复杂度,但可否不分页呢?如果数据量少的话当然可以.但是对于企业信息系统来说数据量不会限制... 继续阅读 >

2020
11-16

vue+Element-ui实现分页效果

当我们向后台请求大量数据的时候，并要在页面展示出来，请求的数据可能上百条数据或者更多的时候，并不想在一个页面展示，这就需要使用分页功能来去完成了。1.本次所使用的是vue2.0+element-ui实现一个分页功能，element-ui这个组件特别丰富，分页中给我提供了一个Pagination分页，使用Pagination快速完成分页功能最终效果展示<divclass="deit"><divclass="crumbs"><el-breadcrumbseparator="/"><el-breadcrumb-it... 继续阅读 >

2020
10-28

UI自动化定位常用实现方法代码示例

8大基础定位driver.find_element_by_id()#id定位driver.find_element_by_name()#name定位driver.find_element_by_class_name()#class名称定位driver.find_element_by_tag_name()#标签定位driver.find_element_by_xpath()#xpath定位driver.find_element_by_css_selector()#css定位driver.find_element_by_link_text()#a标签的文本定位driver.find_element_by_partial_link_text()#a标签的局部文本... 继续阅读 >

2020
10-23

Android自定义UI之粒子效果

本文实例为大家分享了Android自定义UI之粒子效果的具体代码，供大家参考，具体内容如下1.爆炸实体类publicclassBall{publicintcolor;//颜色publicfloatx;//圆心x坐标publicfloaty;//圆心y坐标publicfloatr;//粒子半径publicfloatvX;//粒子水平方向速度publicfloatvY;//粒子y方向速度publicfloataX;//粒子水平方向加速度publicfloatay;//粒子y方向加速度}2.自定义SplitView类importandroid.ani... 继续阅读 >

2020
10-13

Vue中正确使用Element-UI组件的方法实例

 一、CDN目前可以通过unpkg.com/element-ui获取到最新版本的资源，在页面上引入js和css文件即可开始使用。<!--引入样式--><linkrel="stylesheet"href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"><!--引入组件库--><scriptsrc="https://unpkg.com/element-ui/lib/index.js"></script>二、npm安装1、打开终端（开发工具中打开或（win+r）后输入cmd进入）2、进入到对应的项目中例：3、输入vueadd... 继续阅读 >

2020
10-10

VUE Elemen-ui之穿梭框使用方法详解

本文实例为大家分享了VUEElemen-ui之穿梭框使用方法，供大家参考，具体内容如下背景：现在需要使用穿梭框实现，角色的操作功能需要使用ElementTransfer穿梭框HTML代码：<template><el-cardclass="box-card"shadow="never"style="height:700px;"><divslot="header"class="clearfix"style="height:25px"><divstyle="float:left"><spanclass="titel_font">角色操作</span></div><divstyle="float:right"><el-bu... 继续阅读 >

2020
10-10

vue实现日历表格（element-ui）

本文实例为大家分享了vue实现日历表格的具体代码，供大家参考，具体内容如下效果如图：html：后面的日期是循环出来的<divclass="calendar-title"><spanclass="calendar-left"@click="lastDateclick">&lt;</span><spanclass="calendar-center">近期事件</span><spanclass="calendar-right"@click="nextDateclick">></span></div><el-tableref="table"t:data="filterData"borderstripe><el-table-columnalign="ce... 继续阅读 >