分类：组件

2020
10-07

详解vue 组件

Vue的两大核心1.数据驱动-数据驱动界面显示2.模块化-复用公共模块，组件实现模块化提供基础组件基础组件渲染过程template--->ast（抽象语法树）--->render--->VDom(虚拟DOM)--->真实的Dom--->页面Vue组件需要编译，编译过程可能发生在打包过程（使用vue文件编写）运行时（将字符串赋值template字段，挂载到一个元素上并以其DOM内部的HTML作为模板)对应的两种方式runtime-onlyvsruntime-compilerruntim... 继续阅读 >
2020
10-06

如何写好一个Spring组件的实现步骤

如何写好一个Spring组件的实现步骤 本文详细的介绍了Spring组件的实现步骤，分享给大家，具体如下：背景Spring框架提供了许多接口，可以使用这些接口来定制化bean，而非简单的getter/setter或者构造器注入。细翻SpringCloudNetflix、SpringCloudAlibaba等这些构建在SpringFramework的成熟框架源码，你会发现大量的扩展bean例如Eureka健康检查packageorg.springframework.cloud.netflix.eureka;publicclassEurekaHealthCheckHandlerimplementsI... 继续阅读 >
2020
09-30

JS组件库AlloyTouch实现图片轮播过程解析

轮播图也涉及到触摸和触摸反馈，同时，AlloyTouch可以把惯性运动打开或者关闭，并且设置min和max为运动区域，超出会自动回弹。除了一般的竖向滚动，AlloyTouch也可以支持横向滚动，甚至任何属性的运动，因为它的设计的本质就是属性无关，触摸可以反馈到任何属性的运动。所以AlloyTouch制作各种各样的轮播组件还是得心应手。第一种轮播图如上图所示。下面开始实现的过程。第0秒<divid="carousel-container"><divclass="carousel"... 继续阅读 >
2020
09-29

Python Django form 组件动态从数据库取choices数据实例

Python Django form 组件动态从数据库取choices数据实例 app01/models.py：fromdjango.dbimportmodelsclassUserInfo(models.Model):username=models.CharField(max_length=16)password=models.CharField(max_length=16)mobile=models.CharField(max_length=11)classCity(models.Model):name=models.CharField(max_length=16,null=False,unique=True)往City表中添加数据这时候需要重启服务才能在页面上显示这些内容也就是说每次数据库中的内容更新，都需要重启... 继续阅读 >
2020
09-29

Vue 中如何将函数作为 props 传递给组件的实现代码

本文GitHubhttps://github.com/qq44924588...上已经收录，更多往期高赞文章的分类，也整理了很多我的文档，和教程资料。欢迎Star和完善，大家面试可以参照考点复习，希望我们一起有点东西。Vue新手经常问的一个常见问题。可以将字符串、数组、数字和对象作为props传递。但是你能把一个函数当作一个props来传递吗?虽然可以将函数作为props传递，但这种方式不好。相反，Vue有一个专门为解决这问题而设计的功能，接下来，我... 继续阅读 >
2020
09-29

Vue实现图片轮播组件思路及实例解析

1、先看效果：熟悉的图片轮播，只要是个网站，百分之90以上会有个图片轮播。我认为使用图片轮播。第一可以给人以一种美观的感受，而不会显得网站那么呆板，第二可以增加显示内容，同样的区域可以显示更多内容。2、每学一个新东西，图片轮播都是很好的练手案例，而且，也很实用。   3、基本要求：页面加载，自动播放。鼠标悬停，停止播放。鼠标离开，继续播放点击左右箭头切换上一张，下一张图... 继续阅读 >
2020
09-28

jQuery实现的移动端图片缩放功能组件示例

本文实例讲述了jQuery实现的移动端图片缩放功能组件。分享给大家供大家参考，具体如下：源码见这里：https://github.com/CaptainLiao/zujian/tree/master/matrixHTML结构：<divclass="box"><imgsrc="d1981a8ba21975314fd2edf9c09447bb.jpg"><imgsrc="8e7075a2c6b7fb1e083914db000a70c5.jpg"><imgsrc="d1981a8ba21975314fd2edf9c09447bb.jpg"></div>JS:functionMatrix($el,options){this.$el=$el;this.clientW=$(... 继续阅读 >
2020
09-28

jQuery实现移动端图片上传预览组件的方法分析

本文实例讲述了jQuery实现移动端图片上传预览组件的方法。分享给大家供大家参考，具体如下：之前的一篇博客：移动端H5图片预览和压缩，实现了基本的功能。这次则计划做成一个组件，可供前台、后台使用。首先，我们先来捋一捋想要实现的功能：预览删除压缩上传到服务器基本机构这样，我们的组件结构就有了：;!function(window,$,undefined){functionUpload(){};Upload.prototype.change=function(){};Upload... 继续阅读 >
2020
09-28

jQuery实现的上拉刷新功能组件示例

本文实例讲述了jQuery实现的上拉刷新功能组件。分享给大家供大家参考，具体如下：技术要点：1、jQuery的插件写法2、上拉刷新步骤分解3、css样式jQuery的插件写法：$.fn.pluginName=function(){returnthis.each(function(){fn();})};上拉刷新步骤分解：上拉刷新可以分解成三个部分：一是开始（start），记录当前鼠标的位置；二是移动（move），根据下拉的位移响应不同的视图；三是结束（end），刷新页面。;!function... 继续阅读 >
2020
09-28

react组件基本用法示例小结

本文实例讲述了react组件基本用法。分享给大家供大家参考，具体如下：组件间传值：<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>test</title></head><body><divid="app"></div><scriptsrc="../js/react.production.min.js"></script><!--react核心库--><scriptsrc="../js/react-dom.production.min.js"></script><!--操作DOM的react扩展库--><scriptsrc="../js/babel.min.js"></script><!--解析JS... 继续阅读 >
2020
09-27

React.js组件实现拖拽排序组件功能过程解析

因为使用了react.js技术栈，所以封装优先考虑输入和输出。基于数据驱动去渲染页面、控制拖拽元素的顺序。由于我不考虑兼容IE8等旧版本浏览器，拖拽的效果采用了HTML5的拖放（Drag和drop）。当然，如果要求兼容性丰富，使用鼠标点击的相关事件也很简单。实现的效果如下：第一步是先了解H5拖放的相关属性，MDN上有详细的说明，链接有一点需要注意的是，react.js会给所有的属性事件名称前加上"on",后面则为驼峰式写法。例如原生的cl... 继续阅读 >
2020
09-27

element 中 el-menu 组件的无限极循环思路代码详解

实现思路主要组件嵌套（组件自己调用自己）下面是组件所需要的数据{"code":1,"data":{"menuVoList":[{"childList":[{"childList":[],"menu":{"createBy":"0-1","createTime":1587610158,"id":"2f006aed6a114579bd8b9809724428f7","name":"系统用户权限管理","parentId":"6d68079a16b94292990f612237bd048e","path":"/userallotrole",... 继续阅读 >
2020
09-27

Android ListView UI组件使用说明

Android ListView UI组件使用说明 一、ListView该组件是android中最常用的一个UI组件，用于实现在屏幕上显示​多个内容，以便于我们用手指来回翻转。先在layout中进行布局我们的组件<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"><ListViewandroid:id="@+id/list_view"android:layout_width="match_parent"android:layout_height="m... 继续阅读 >
2020
09-25

Yii框架组件的事件机制原理与用法分析

本文实例讲述了Yii框架组件的事件机制原理与用法。分享给大家供大家参考，具体如下：在深入分析Yii的运行之前，我们先来看一下Yii框架中一个很重要的机制-事件。Yii官方参考文档关于组件事件的解释：=======================================================================组件事件是一些特殊的属性，它们使用一些称作事件句柄（eventhandlers）的方法作为其值。附加(分配)一个方法到一个事件将会引起方法在事... 继续阅读 >
2020
09-24

SpringCloud链路追踪组件Sleuth配置方法解析

SpringCloud链路追踪组件Sleuth配置方法解析 1.官方文档https://spring.io/projects/spring-cloud-sleuth什么是Sleuth?一个组件，专门用于追踪每个请求的完整调用链路最主要功能？做日志埋点2.添加依赖<dependency><groupId>org.springframework.cloud</groupId><artifactId>spring-cloud-starter-sleuth</artifactId></dependency>3.接口代码参考地址https://www.cnblogs.com/tianhengblogs/p/12487495.html4.访问地址或者直接写一个简单的接口就可以了http://127.0.... 继续阅读 >
2020
09-24

Vue组件模板及组件互相引用代码实例

1.vue组件都是由这三部分组成<template><div></div></template><script>exportdefault{}</script><style></style>2.组件间的引用分3步走，假设现在有两个组件App.vue，和Add.vue，现在要把Add.vue组件引入到App.vue组件中App.vue<template>//第3步<Add/></template><script>//第1步importAddfrom'./components/Add.vue'//第2步components:{Add}}</script><style></style>3.组件间数据的传递假... 继续阅读 >