custom select

在 Vue.js 中制作自定义选择组件

感情迁移 提交于 2021-01-30 08:24:33
在 Vue.js 中制作自定义选择组件 疯狂的技术宅 前端先锋 翻译:疯狂的技术宅 作者:Lane Wagner 来源:hackernoon 正文共:2337 字 预计阅读时间:7 分钟 定制 select 标签的设计非常困难。有时候,如果不使用样式化的 div 和自定义 JavaScript 的结合来构建自己的脚本,那是不可能的。在本文中,你将学习如何构建使用完全自定义 CSS 设置样式的 Vue.js 组件。 Demo: https://codesandbox.io/s/custom-vuejs-select-component-8nqgd HTML 1<template> 2 <div 3 class="custom-select" 4 :tabindex="tabindex" 5 @blur="open = false" 6 > 7 <div 8 class="selected" 9 :class="{open: open}" 10 @click="open = !open" 11 > 12 {{ selected }} 13 </div> 14 <div 15 class="items" 16 :class="{selectHide: !open}" 17 > 18 <div 19 class="item" 20 v-for="(option, i) of options

Java Spring Boot VS .NetCore (八) Java 注解 vs .NetCore Attribute

和自甴很熟 提交于 2020-12-17 08:28:45
继续前面的章节,这里我介绍下注解,其实Java注解跟.NetCore的特性标签类似,下面我们通过代码来说明 Java自定义注解 首先我先说下Java注解需要使用的注解 @Target(value = ElementType.METHOD) @Retention(RetentionPolicy.RUNTIME) @Documented Taget:指定注解在什么地方生效,作用于什么对象上,参数很多这里把源码拉出来了,每一个的意思就不过多介绍,一看就明白 public enum ElementType { /** 类、接口(包括注释类型)或枚举声明 */ TYPE, /** 字段声明(包括枚举常量) */ FIELD, /** 方法声明 */ METHOD, /** 形式参数声明 */ PARAMETER, /** 构造函数声明 */ CONSTRUCTOR, /** 局部变量声明 */ LOCAL_VARIABLE, /** 注释类型声明 */ ANNOTATION_TYPE, /** 程序包声明 */ PACKAGE, /** * 类型参数声明 * * @since 1.8 */ TYPE_PARAMETER, /** * 使用类型 * * @since 1.8 */ TYPE_USE } public enum RetentionPolicy { /** 注解将被编译器丢弃 */

Ant Design Select 分页下拉允许搜索

馋奶兔 提交于 2020-08-19 19:02:34
基于Ant Design Select组件 📙 项目地址 : 👉 GitHub地址: https://github.com/zlinggnilz/work-demo/blob/master/src/components/CustomSelect/index.js 👉 查看在线示例: https://codesandbox.io/s/funny-worker-lrhvt 📘 定制化组件 CustomSelect : 不传入children,通过dataSource传入数组遍历出option,数组元素包含key 和 label 组件 CustomSelect 代码: import React from "react" ; import { Select } from "antd" ; import PropTypes from "prop-types" ; const { Option } = Select; export default class CustomSelect extends React.Component { static propTypes = { dataSource: PropTypes.arrayOf( PropTypes.shape({ key: PropTypes.oneOfType([PropTypes.string, PropTypes.number]

Java Spring Boot VS .NetCore (八) Java 注解 vs .NetCore Attribute

瘦欲@ 提交于 2020-05-02 04:16:29
Java Spring Boot VS .NetCore (一)来一个简单的 Hello World Java Spring Boot VS .NetCore (二)实现一个过滤器Filter Java Spring Boot VS .NetCore (三)Ioc容器处理 Java Spring Boot VS .NetCore (四)数据库操作 Spring Data JPA vs EFCore Java Spring Boot VS .NetCore (五)MyBatis vs EFCore Java Spring Boot VS .NetCore (六) UI thymeleaf vs cshtml Java Spring Boot VS .NetCore (七) 配置文件 Java Spring Boot VS .NetCore (八) Java 注解 vs .NetCore Attribute Java Spring Boot VS .NetCore (九) Spring Security vs .NetCore Security Java Spring Boot VS .NetCore (十) Java Interceptor vs .NetCore Interceptor Java Spring Boot VS .NetCore (十一)自定义标签 Java Tag