complete相关知识
-
30 天精通 RxJS(19): 实务范例 - 简易 Auto Complete 实作今天我们要做一个 RxJS 的经典范例 - 自动完成 (Auto Complete),自动完成在实务上的应用非常广泛,几乎随处可见这样的功能,只要是跟表单、搜寻相关的都会看到。虽然是个很常见的功能,但多数的工程师都只是直接套套件来完成,很少有人会自己从头到尾把完整的逻辑写一次。如果有自己实作过这个功能的工程师,应该就会知道这个功能在实作的过程中很多细节会让程式码变的非常複杂,像是要如何取消上一次发送出去的 request、要如何优化请求次数... 等等,这些小细节都会让程式码变的非常複杂且很难维护。就让我们一起来用 RxJS 来实作这个功能吧!需求分析首先我们会有一个搜寻框(input#search),当我们在上面打字并停顿超过 100 毫秒就发送 HTTP Request 来取得建议选项并显示在收寻框下方(ul#suggest-list),如果使用者在前一次发送的请求还没有回来就打了下一个字,此时前一个发送的请求就要捨弃掉,当建议选项显示之后可以用滑鼠点击取建议选项代搜寻框的文字。image.png上面的
-
Docker - 创建并运行rabbitmq镜像Docker - 创建并运行rabbitmq镜像 1、rabbitmq 镜像说明 rabbitmq 的镜像版本,其中带management 的代表是有管理界面的版本,否则是不带管理界面的 2、下载rabbitmq 镜像 运行如下命令 docker pull rabbitmq:3.7-management 输出 3.7-management: Pulling from library/rabbitmq 5b7339215d1d: Pull complete 14ca88e9f672: Pull complete a31c3b1caad4: Pull complete b054a26005b7: Pull complete eef17c6cb6cf: Pull complete d5a267fdfe2c: Pull comple
-
jquery的知识必记点——程序员飞升上神历劫中!(动画篇)jquery——动画篇 1.动画的基础隐藏和显示 1)hide方法 $elem.hide() .hide("fast / slow") 2)show()方法 $('elem').hide(3000).show(3000) 3)隐藏切换toggle方法 如果元素是最初显示,它会被隐藏 如果隐藏的,它会显示出来 2.上卷下拉效果 1)下拉动画slideDown .slideDown( [duration ] [, complete ] ) 2)上卷动画slideUp .slideUp( [duration ] [, easing ] [, complete ] ) 3)上卷下拉切换slideToggle.slideToggle( [duration ] ,[ complete ] )
-
实现前端开发几个常用技巧如何知道iframe下载完成定时器轮询监听readyState的状态,如果是 complete 或者 interactive 说明文件加载完成。let iframe = document.createElement('iframe'); iframe.src = path; iframe.style.display = 'none';document.body.appendChild(iframe);const timer = setInterval(() => { const iframeDoc = iframe.contentDocument || iframe.contentWindow.document; if (iframeDoc.readyState == 'complete' || iframeDoc.readyState == 'interactive') { document.body.removeAttribute(iframe); clea
complete相关课程
complete相关教程
- 4. Docker 安装 Zookeeper 查询镜像我们可以去 Docker Hub 的官网查看 Zookeeper 的镜像:https://hub.docker.com/_/zookeeper也可以使用 search 命令来查询 Zookeeper 镜像:# 查询 zookeeper 镜像docker search zookeeper执行这条命令会输出很多 zookeeper 镜像,这里我们可以看到第一条就是官方的 zookeeper 镜像。NAME DESCRIPTION STARS OFFICIAL AUTOMATEDzookeeper Apache ZooKeeper is an open-source... 936 [OK] 拉取镜像接下来我们开始拉取 Zookeeper 镜像:# 拉取 zookeeper 镜像,默认是 latestdocker pull zookeeper# 选择版本拉取就在后面跟上版本信息docker pull zookeeper:3.6这里我们选择 latest 版的镜像,执行 docker pull zookeeper 后开始拉取镜像:Using default tag: latestlatest: Pulling from library/zookeeperd121f8d1c412: Pull complete 75deccc0fc24: Pull complete 690f480f5f48: Pull complete b20f9556d3e0: Pull complete 30b60f0b1627: Pull complete a774eb30ae9a: Pull complete 99abe5102984: Pull complete f0154f2759c0: Pull complete Digest: sha256:6c051390cfae7958ff427834937c353fc6c34484f6a84b3e4bc8c512b53a16f6Status: Downloaded newer image for zookeeper:latestdocker.io/library/zookeeper:latest查看本地镜像拉取镜像完毕后,我们使用 images 命令来查看镜像:# 查看镜像docker images# 输出信息REPOSITORY TAG IMAGE ID CREATED SIZEzookeeper latest 36b7f3aa2340 10 days ago 252MB启动镜像接下来我们就可以启动 zookeeper 镜像了。# run 启动,-d 后台运行,--name 别名,-p 端口映射(可以写多个), 容器名称:版本(不写默认latest)docker run -d --name=zookeeper -p 2181:2181 zookeeper启动成功后会输出当前容器的 ID:6e191d07172187ec27c2227ae99760177b2fe7dbca25061af35586dd7ee0d1cb查看容器这里我们可以使用 container 命令来查看容器:# 查看所有的容器docker container ls -a输出容器列表,我们可以看见刚才启动的 zookeeper 容器:CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES6e191d071721 zookeeper "/docker-entrypoint.…" 3 minutes ago Up 3 minutes zookeeper进入容器使用 exec 命令我们就可以进入已经启动的 zookeeper 容器:docker exec -it zookeeper /bin/bash进入容器后我们使用 ls 命令来查看 文件列表:LICENSE.txt NOTICE.txt README.md README_packaging.md bin conf docs libZookeeper 的命令就在 bin 目录中,我们可以使用 zkCli.sh 连接 Zookeeper 服务端,也可以使用宿主机的客户端加映射的端口来连接 Docker 容器内的 Zookeeper 服务端。想要退出容器的话使用 exit 命令即可。关闭容器如果我们想要关闭容器,在容器外使用以下命令:docker container stop zookeeper如果这样来启动多个容器,然后一个一个配置的话,也是一件繁琐的事情。那么有没有一次性能启动多个 Zookeeper 的方式呢?接下来我们就使用 Docker Compose 来构建 Zookeeper 集群。
- 7. 编写列表页面(views/list.vue) <template> <div> <el-table class="el-table" :data="todoList" border style="width: 100%" :row-class-name="tableRowClassName" > <el-table-column fixed prop="name" label="事项名称" width="150"> </el-table-column> <el-table-column prop="date" label="事项截止时间" width="120"> </el-table-column> <el-table-column prop="type" label="事项类型" width="120"> </el-table-column> <el-table-column prop="urgent" label="是否紧急" width="120"> <template slot-scope="scope"> <span>{{ scope.row.urgent | urgentText }}</span> </template> </el-table-column> <el-table-column prop="content" label="事项详情"></el-table-column> <el-table-column label="操作" width="160"> <template slot-scope="scope"> <el-button @click="handleDelete(scope.$index)" type="danger" size="small" >删除</el-button > <el-button type="primary" size="small" @click="handleComplete(scope.$index)" :disabled="scope.row.isComplete === 1" >完成</el-button > </template> </el-table-column> </el-table> <div style="text-align:left"> 总共:{{ todoList.length }} 个任务。 已完成:{{ count(1) }} 个任务。未完成:{{ count(0) }} 个任务。 </div> </div></template><script>import { mapGetters, mapMutations } from "vuex";import { COMPLETE_TODO, DEL_TODO } from "../store/types";export default { methods: { ...mapMutations([COMPLETE_TODO, DEL_TODO]), handleDelete(index) { this.DEL_TODO({ index }); }, handleComplete(index) { this.COMPLETE_TODO({ index }); }, tableRowClassName({ row }) { if (row.isComplete === 1) { return "complete-row"; } return ""; } }, computed: { ...mapGetters(["todoList", "count"]) }, filters: { urgentText(value) { if (value === 0) { return "紧急"; } return "非紧急"; } }, data() { return { tableData: [] }; }};</script><style>.el-table .complete-row { background: #f0f9eb;}</style>
- 3.3 阶段处理 $.ajax 提供了非常人性化的函数配置项,分别有:beforeSend、error、dataFilter、success、complete。我把它们分别归为请求前和请求后两个阶段。3.3.1 请求前对于一个 Ajax 的请求来说,我们在正式发送请求之前可能会对我们的 Ajax 做一些提前的配置或者预先要进行的操作。那么,我们可以非常愉快的使用 beforeSend 。3.3.1.1 beforeSendbeforeSend(xhr)beforeSend 指定的是发送请求之前要先执行的方法。 并且,jQuery 会在 beforeSend 中传入当前的 XMLHttpRequest 对象,方便我们在该函数中做预先的操作。打个比方,我们可以通过这个函数,给当前的 Ajax 请求添加自定义的 headers 项。3.3.2 请求后当我们成功的发送了请求,那么我们接下来就是要解决返回结果的问题了。3.3.2.1 dataFilter 和 success在服务器成功响应之后,我们需要对结果进行获取和处理,这个时候 dataFilter 和 success 就派上用场了。其中:dataFilter :dataFilter (Object data, String type)dataFilter 接受一个服务端返回的原始数据和一个 dataType 值作为参数,会在请求成功之后调用,目的是为了我们可以在请求成功之后对数据进行进一步的处理、过滤。 对比另外一个函数 —— success。success:success(( Object data, String textStatus, jqXHR jqXHR ))success 是成功响应后执行的函数,优先级在 dataFilter 之后。 它接受三个参数,分别是:数据对象、状态描述字符串以及一个 XHR 对象。我们通常会在这个函数里面进行对结果的操作。3.3.2.2 错误处理当然也会有请求失败的情况,那么我们该如何来处理呢?$.ajax 同样提供了人性化的一个回调函数 error 。error(jqXHR jqXHR, String textStatus, String errorThrown)error 接受三个参数,分别为 一个 XHR 对象、一个状态描述字符串以及一个捕获异常的字符串。假如我在程序中定义了这样一个 $.ajax :$.ajax({ url: '/jquery_ajax/get/2', method: 'GET', error (xhr, status, err) { console.log(xhr, status, err) }})其中,我们的 url 指定的是一个不存在的接口,那么我们可以在控制台看到这样的打印信息:显而易见,我们可以很轻易在这个函数中获取到请求的错误信息。事实上,我们常常会在 error 中对异常做进一步的操作。举个栗子,在我们开发的应用中,我们不可能把请求失败的这样一个结果自己在程序中抹干净不上报给用户知道,如果我们内部自己消化了,用户不知道自己到底成不成功,这样的体验就非常糟糕了!这个时候,我们或许会选择弹一个框,告知我们失败的结果以及下一步的操作。3.3.2.3 最后处理好了,来继续思考这样一个场景:假如我们发起一个 $.ajax(),为了让用户感知,我们一般会弹起一个 loading 的界面,让用户稍微等待一下。那问题来了,我们的 loading 界面到底什么时候应该关闭呢?是在请求成功之后关闭吗?那如果请求发生错误怎么办?总不能错误了就不关闭 loading 了吧?那或者在成功和失败的回调中都执行关闭 loading 的方法,这貌似是一个不错的做法,但是这样的做法我们要在两个地方都进行改动,未免太过麻烦,并且后期代码也不好维护呢。别忘了,我们还有一个 complete。complete(jqXHR jqXHR, String textStatus)complete 会在请求完成之后执行,无论请求成功或者失败。 我们可以很好地将一个请求的善后工作交给它来进行。
- 2.5 扩展问题 如果主库导出时出现如下警告信息:mysqldump -uroot -p --single-transaction --master-data=2 --databases test123 > test_200908.sqlEnter password: Warning: A partial dump from a server that has GTIDs will by default include the GTIDs of all transactions, even those that changed suppressed parts of the database. If you don't want to restore GTIDs, pass --set-gtid-purged=OFF. To make a complete dump, pass --all-databases --triggers --routines --events.当MySQL为GTID模式时,用mysqldump导出默认会带上当前已执行的GTID如果是从库的GTID_EXECUTED为空值,即从库无任何事务操作,则无需理会;如果是从库的GTID_EXECUTED为非空,两种解决方案。在主库 mysqldump 导出时,加上参数 --set-gtid-purged=OFF,适合场景为导出部分数据;在从库 mysqldump 导入前,执行 reset master,适合场景为搭建新从库。
- 6.2 线程唤醒 思考:当前线程休眠了,那么什么时候进行唤醒呢?源码分析如下所示:@Overridepublic Promise<V> setSuccess(V result) { //1.setSuccess0 赋值操作 if (setSuccess0(result)) { //2.通知执行监听器 notifyListeners(); return this; } throw new IllegalStateException("complete already: " + this);}private boolean setSuccess0(V result) { //继续进入方法 return setValue0(result == null ? SUCCESS : result);}private boolean setValue0(Object objResult) { if (RESULT_UPDATER.compareAndSet(this, null, objResult) || RESULT_UPDATER.compareAndSet(this, UNCANCELLABLE, objResult)) { //继续进入方法 checkNotifyWaiters(); return true; } return false;}private synchronized void checkNotifyWaiters() { if (waiters > 0) { //核心:唤醒之前休眠的线程 notifyAll(); }}源码分析总结:堵塞的核心是通过 Object.wait () 方法进行休眠当前线程,普通的 Java 多线程知识;执行完成之后给不同状态(setSuccess、setFailure)赋值的时候唤醒休眠的线程;唤醒线程之后调用监听器的方法 l.operationComplete(future);
- 3. Docker 安装 在不同的操作系统中都可以安装 Docker ,本节内容中只演示 Ubuntu 环境下的 Docker 安装。本次安装演示的 Ubuntu 版本为 Ubuntu 20.04.1 LTS 。apt 更换国内源在安装应用之前,我们需要把 apt 更换为国内源,这里我们选择阿里云的 mirros.aliyun.com。# 备份 apt 源列表文件sudo cp /etc/apt/sources.list /etc/apt/sources.list.bak# 更换源为 mirros.aliyun.comsudo sed -i s@/archive.ubuntu.com/@/mirrors.aliyun.com/@g /etc/apt/sources.list# 更新源sudo apt-get cleansudo apt-get update更换完毕后,我们还需要安装 apt 的一些工具,如 https,curl 等。安装 apt 依赖包sudo apt-get -y install apt-transport-https ca-certificates curl gnupg-agent software-properties-common获取 GPG 密钥证书我们这里使用阿里云的镜像来获取 GPG 密钥:curl -fsSL http://mirrors.aliyun.com/docker-ce/linux/ubuntu/gpg | sudo apt-key add -获取成功会返回 OK ,我们使用 apt-key finger 命令查看:apt-key finger# 输出密钥信息/etc/apt/trusted.gpg--------------------pub rsa4096 2017-02-22 [SCEA]9DC8 5822 9FC7 DD38 854A E2D8 8D81 803C 0EBF CD88uid [ unknown] Docker Release (CE deb) <docker@docker.com>sub rsa4096 2017-02-22 [S]密钥添加成功后,我们就可以开始后续的安装了。添加 Docker 源为了更快速的安装 Docker,这里我们添加阿里云的 Docker 源,首先我们先使用 lsb_release -a 命令获取当前系统的 Codename:lsb_release -a# 输出系统信息No LSB modules are available.Distributor ID: UbuntuDescription: Ubuntu 20.04.1 LTSRelease: 20.04Codename: focal本系统的 Codename 也就是版本代码为 focal,我们在添加 Docker 源的时候就会使用这个版本:# 添加 docker-ce 源,系统为 ubuntu,系统版本为 focal, stable 为 docker 稳定版。sudo add-apt-repository "deb [arch=amd64] http://mirrors.aliyun.com/docker-ce/linux/ubuntu focal stable"执行完毕后,我们需要更新 apt 源:sudo apt-get updateDocker 安装更新完源后,我们就可以开始安装 Docker 组件了:sudo apt-get install docker-ce docker-ce-cli containerd.io执行这一行命令需要一点时间,稍等片刻。完成后我们就可以来查看 Docker 是否安装成功了。查看 Docker 版本使用 docker -v 来查看 Docker 版本:docker -v# 输出 docker 版本信息Docker version 19.03.13, build 4484c46d9d看到版本信息输出就说明我们的 Docker 源安装成功了。Tips: 如果安装失败,需要注意系统的版本和添加的 Docker 源是否能使用。安装成功后,我们来添加 Docker Image 镜像源。添加 Docker Image 镜像源使用阿里云的 Docker Image 镜像源,需要登录阿里云官网开启 容器镜像服务:https://cr.console.aliyun.com/cn-hangzhou/instances/mirrors添加 Docker Image 镜像源为阿里云镜像,这里同学们使用自己账号的加速器地址即可:sudo mkdir -p /etc/dockersudo tee /etc/docker/daemon.json <<-'EOF'{"registry-mirrors": ["https://xxxxxx.mirror.aliyuncs.com"]}EOF添加完毕后,我们就可以启动我们的 Docker 服务了。启动 Dockerservice docker start# 输出启动信息* Starting Docker: docker 启动完成,接下来我们进行测试。Docker 测试执行测试命令:docker run hello-world输出:Unable to find image 'hello-world:latest' locallylatest: Pulling from library/hello-world0e03bdcc26d7: Pull complete Digest: sha256:4cf9c47f86df71d48364001ede3a4fcd85ae80ce02ebad74156906caff5378bcStatus: Downloaded newer image for hello-world:latestHello from Docker!This message shows that your installation appears to be working correctly.To generate this message, Docker took the following steps:1. The Docker client contacted the Docker daemon.2. The Docker daemon pulled the "hello-world" image from the Docker Hub.(amd64)3. The Docker daemon created a new container from that image which runs theexecutable that produces the output you are currently reading.4. The Docker daemon streamed that output to the Docker client, which sent itto your terminal.To try something more ambitious, you can run an Ubuntu container with:$ docker run -it ubuntu bashShare images, automate workflows, and more with a free Docker ID:https://hub.docker.com/For more examples and ideas, visit:https://docs.docker.com/get-started/我们看到这段信息就说明,我们的 Docker 测试成功了。那么接下来,我们就可以使用 Docker 来安装 Zookeeper 服务。
complete相关搜索
-
c 正则表达式
c string
c 编程
c 程序设计
c 程序设计教程
c 多线程编程
c 教程
c 数组
c 委托
c 下载
c 线程
c 语言
caidan
cakephp
call
calloc
calu
camera
caption
case语句