main
limingtao
11 months ago
parent
1394352f6c
commit
2893cfa8d3
11 changed files with 1194 additions and 245 deletions
@ -0,0 +1,115 @@ |
||||
## 1.1.19（2024-07-18） |
||||
- 修复 初始值传入 null 导致input报错的bug |
||||
## 1.1.18（2024-04-11） |
||||
- 修复 easyinput组件双向绑定问题 |
||||
## 1.1.17（2024-03-28） |
||||
- 修复 在头条小程序下丢失事件绑定的问题 |
||||
## 1.1.16（2024-03-20） |
||||
- 修复 在密码输入情况下 清除和小眼睛覆盖bug 在edge浏览器下显示双眼睛bug |
||||
## 1.1.15（2024-02-21） |
||||
- 新增 左侧插槽：left |
||||
## 1.1.14（2024-02-19） |
||||
- 修复 onBlur的emit传值错误 |
||||
## 1.1.12（2024-01-29） |
||||
- 补充 adjust-position文档属性补充 |
||||
## 1.1.11（2024-01-29） |
||||
- 补充 adjust-position属性传递值：（Boolean）当键盘弹起时，是否自动上推页面 |
||||
## 1.1.10（2024-01-22） |
||||
- 去除 移除无用的log输出 |
||||
## 1.1.9（2023-04-11） |
||||
- 修复 vue3 下 keyboardheightchange 事件报错的bug |
||||
## 1.1.8（2023-03-29） |
||||
- 优化 trim 属性默认值 |
||||
## 1.1.7（2023-03-29） |
||||
- 新增 cursor-spacing 属性 |
||||
## 1.1.6（2023-01-28） |
||||
- 新增 keyboardheightchange 事件，可监听键盘高度变化 |
||||
## 1.1.5（2022-11-29） |
||||
- 优化 主题样式 |
||||
## 1.1.4（2022-10-27） |
||||
- 修复 props 中背景颜色无默认值的bug |
||||
## 1.1.0（2022-06-30） |
||||
|
||||
- 新增 在 uni-forms 1.4.0 中使用可以在 blur 时校验内容 |
||||
- 新增 clear 事件，点击右侧叉号图标触发 |
||||
- 新增 change 事件 ，仅在输入框失去焦点或用户按下回车时触发 |
||||
- 优化 组件样式，组件获取焦点时高亮显示，图标颜色调整等 |
||||
|
||||
## 1.0.5（2022-06-07） |
||||
|
||||
- 优化 clearable 显示策略 |
||||
|
||||
## 1.0.4（2022-06-07） |
||||
|
||||
- 优化 clearable 显示策略 |
||||
|
||||
## 1.0.3（2022-05-20） |
||||
|
||||
- 修复 关闭图标某些情况下无法取消的 bug |
||||
|
||||
## 1.0.2（2022-04-12） |
||||
|
||||
- 修复 默认值不生效的 bug |
||||
|
||||
## 1.0.1（2022-04-02） |
||||
|
||||
- 修复 value 不能为 0 的 bug |
||||
|
||||
## 1.0.0（2021-11-19） |
||||
|
||||
- 优化 组件 UI，并提供设计资源，详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource) |
||||
- 文档迁移，详见:[https://uniapp.dcloud.io/component/uniui/uni-easyinput](https://uniapp.dcloud.io/component/uniui/uni-easyinput) |
||||
|
||||
## 0.1.4（2021-08-20） |
||||
|
||||
- 修复 在 uni-forms 的动态表单中默认值校验不通过的 bug |
||||
|
||||
## 0.1.3（2021-08-11） |
||||
|
||||
- 修复 在 uni-forms 中重置表单，错误信息无法清除的问题 |
||||
|
||||
## 0.1.2（2021-07-30） |
||||
|
||||
- 优化 vue3 下事件警告的问题 |
||||
|
||||
## 0.1.1 |
||||
|
||||
- 优化 errorMessage 属性支持 Boolean 类型 |
||||
|
||||
## 0.1.0（2021-07-13） |
||||
|
||||
- 组件兼容 vue3，如何创建 vue3 项目，详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834) |
||||
|
||||
## 0.0.16（2021-06-29） |
||||
|
||||
- 修复 confirmType 属性（仅 type="text" 生效）导致多行文本框无法换行的 bug |
||||
|
||||
## 0.0.15（2021-06-21） |
||||
|
||||
- 修复 passwordIcon 属性拼写错误的 bug |
||||
|
||||
## 0.0.14（2021-06-18） |
||||
|
||||
- 新增 passwordIcon 属性，当 type=password 时是否显示小眼睛图标 |
||||
- 修复 confirmType 属性不生效的问题 |
||||
|
||||
## 0.0.13（2021-06-04） |
||||
|
||||
- 修复 disabled 状态可清出内容的 bug |
||||
|
||||
## 0.0.12（2021-05-12） |
||||
|
||||
- 新增 组件示例地址 |
||||
|
||||
## 0.0.11（2021-05-07） |
||||
|
||||
- 修复 input-border 属性不生效的问题 |
||||
|
||||
## 0.0.10（2021-04-30） |
||||
|
||||
- 修复 ios 遮挡文字、显示一半的问题 |
||||
|
||||
## 0.0.9（2021-02-05） |
||||
|
||||
- 调整为 uni_modules 目录规范 |
||||
- 优化 兼容 nvue 页面 |
||||
@ -0,0 +1,54 @@ |
||||
/** |
||||
* @desc 函数防抖 |
||||
* @param func 目标函数 |
||||
* @param wait 延迟执行毫秒数 |
||||
* @param immediate true - 立即执行， false - 延迟执行 |
||||
*/ |
||||
export const debounce = function(func, wait = 1000, immediate = true) { |
||||
let timer; |
||||
return function() { |
||||
let context = this, |
||||
args = arguments; |
||||
if (timer) clearTimeout(timer); |
||||
if (immediate) { |
||||
let callNow = !timer; |
||||
timer = setTimeout(() => { |
||||
timer = null; |
||||
}, wait); |
||||
if (callNow) func.apply(context, args); |
||||
} else { |
||||
timer = setTimeout(() => { |
||||
func.apply(context, args); |
||||
}, wait) |
||||
} |
||||
} |
||||
} |
||||
/** |
||||
* @desc 函数节流 |
||||
* @param func 函数 |
||||
* @param wait 延迟执行毫秒数 |
||||
* @param type 1 使用表时间戳，在时间段开始的时候触发 2 使用表定时器，在时间段结束的时候触发 |
||||
*/ |
||||
export const throttle = (func, wait = 1000, type = 1) => { |
||||
let previous = 0; |
||||
let timeout; |
||||
return function() { |
||||
let context = this; |
||||
let args = arguments; |
||||
if (type === 1) { |
||||
let now = Date.now(); |
||||
|
||||
if (now - previous > wait) { |
||||
func.apply(context, args); |
||||
previous = now; |
||||
} |
||||
} else if (type === 2) { |
||||
if (!timeout) { |
||||
timeout = setTimeout(() => { |
||||
timeout = null; |
||||
func.apply(context, args) |
||||
}, wait) |
||||
} |
||||
} |
||||
} |
||||
} |
||||
@ -0,0 +1,88 @@ |
||||
{ |
||||
"id": "uni-easyinput", |
||||
"displayName": "uni-easyinput 增强输入框", |
||||
"version": "1.1.19", |
||||
"description": "Easyinput 组件是对原生input组件的增强", |
||||
"keywords": [ |
||||
"uni-ui", |
||||
"uniui", |
||||
"input", |
||||
"uni-easyinput", |
||||
"输入框" |
||||
], |
||||
"repository": "https://github.com/dcloudio/uni-ui", |
||||
"engines": { |
||||
"HBuilderX": "" |
||||
}, |
||||
"directories": { |
||||
"example": "../../temps/example_temps" |
||||
}, |
||||
"dcloudext": { |
||||
"sale": { |
||||
"regular": { |
||||
"price": "0.00" |
||||
}, |
||||
"sourcecode": { |
||||
"price": "0.00" |
||||
} |
||||
}, |
||||
"contact": { |
||||
"qq": "" |
||||
}, |
||||
"declaration": { |
||||
"ads": "无", |
||||
"data": "无", |
||||
"permissions": "无" |
||||
}, |
||||
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui", |
||||
"type": "component-vue" |
||||
}, |
||||
"uni_modules": { |
||||
"dependencies": [ |
||||
"uni-scss", |
||||
"uni-icons" |
||||
], |
||||
"encrypt": [], |
||||
"platforms": { |
||||
"cloud": { |
||||
"tcb": "y", |
||||
"aliyun": "y", |
||||
"alipay": "n" |
||||
}, |
||||
"client": { |
||||
"App": { |
||||
"app-vue": "y", |
||||
"app-nvue": "y" |
||||
}, |
||||
"H5-mobile": { |
||||
"Safari": "y", |
||||
"Android Browser": "y", |
||||
"微信浏览器(Android)": "y", |
||||
"QQ浏览器(Android)": "y" |
||||
}, |
||||
"H5-pc": { |
||||
"Chrome": "y", |
||||
"IE": "y", |
||||
"Edge": "y", |
||||
"Firefox": "y", |
||||
"Safari": "y" |
||||
}, |
||||
"小程序": { |
||||
"微信": "y", |
||||
"阿里": "y", |
||||
"百度": "y", |
||||
"字节跳动": "y", |
||||
"QQ": "y" |
||||
}, |
||||
"快应用": { |
||||
"华为": "u", |
||||
"联盟": "u" |
||||
}, |
||||
"Vue": { |
||||
"vue2": "y", |
||||
"vue3": "y" |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
@ -0,0 +1,11 @@ |
||||
|
||||
|
||||
### Easyinput 增强输入框 |
||||
> **组件名：uni-easyinput** |
||||
> 代码块： `uEasyinput` |
||||
|
||||
|
||||
easyinput 组件是对原生input组件的增强 ，是专门为配合表单组件[uni-forms](https://ext.dcloud.net.cn/plugin?id=2773)而设计的，easyinput 内置了边框，图标等，同时包含 input 所有功能 |
||||
|
||||
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-easyinput) |
||||
#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839 |
||||
@ -1,91 +1,91 @@ |
||||
<template> |
||||
<text class="uni-icons" :style="styleObj"> |
||||
<slot>{{unicode}}</slot> |
||||
</text> |
||||
</template> |
||||
|
||||
<script> |
||||
import { fontData, IconsDataItem } from './uniicons_file' |
||||
|
||||
/** |
||||
* Icons 图标 |
||||
* @description 用于展示 icon 图标 |
||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=28 |
||||
* @property {Number,String} size 图标大小 |
||||
* @property {String} type 图标图案，参考示例 |
||||
* @property {String} color 图标颜色 |
||||
* @property {String} customPrefix 自定义图标 |
||||
* @event {Function} click 点击 Icon 触发事件 |
||||
*/ |
||||
export default { |
||||
name: "uni-icons", |
||||
props: { |
||||
type: { |
||||
type: String, |
||||
default: '' |
||||
}, |
||||
color: { |
||||
type: String, |
||||
default: '#333333' |
||||
}, |
||||
size: { |
||||
type: [Number, String], |
||||
default: 16 |
||||
}, |
||||
fontFamily: { |
||||
type: String, |
||||
default: '' |
||||
} |
||||
}, |
||||
data() { |
||||
return {}; |
||||
}, |
||||
computed: { |
||||
unicode() : string { |
||||
let codes = fontData.find((item : IconsDataItem) : boolean => { return item.font_class == this.type }) |
||||
if (codes !== null) { |
||||
return codes.unicode |
||||
} |
||||
return '' |
||||
}, |
||||
iconSize() : string { |
||||
const size = this.size |
||||
if (typeof size == 'string') { |
||||
const reg = /^[0-9]*$/g |
||||
return reg.test(size as string) ? '' + size + 'px' : '' + size; |
||||
// return '' + this.size |
||||
} |
||||
return this.getFontSize(size as number) |
||||
}, |
||||
styleObj() : UTSJSONObject { |
||||
if (this.fontFamily !== '') { |
||||
return { color: this.color, fontSize: this.iconSize, fontFamily: this.fontFamily } |
||||
} |
||||
return { color: this.color, fontSize: this.iconSize } |
||||
} |
||||
}, |
||||
created() { }, |
||||
methods: { |
||||
/** |
||||
* 字体大小 |
||||
*/ |
||||
getFontSize(size : number) : string { |
||||
return size + 'px'; |
||||
}, |
||||
}, |
||||
} |
||||
</script> |
||||
|
||||
<style scoped> |
||||
@font-face { |
||||
font-family: UniIconsFontFamily; |
||||
src: url('./uniicons.ttf'); |
||||
} |
||||
|
||||
.uni-icons { |
||||
font-family: UniIconsFontFamily; |
||||
font-size: 18px; |
||||
font-style: normal; |
||||
color: #333; |
||||
} |
||||
<template> |
||||
<text class="uni-icons" :style="styleObj"> |
||||
<slot>{{unicode}}</slot> |
||||
</text> |
||||
</template> |
||||
|
||||
<script> |
||||
import { fontData, IconsDataItem } from './uniicons_file' |
||||
|
||||
/** |
||||
* Icons 图标 |
||||
* @description 用于展示 icon 图标 |
||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=28 |
||||
* @property {Number,String} size 图标大小 |
||||
* @property {String} type 图标图案，参考示例 |
||||
* @property {String} color 图标颜色 |
||||
* @property {String} customPrefix 自定义图标 |
||||
* @event {Function} click 点击 Icon 触发事件 |
||||
*/ |
||||
export default { |
||||
name: "uni-icons", |
||||
props: { |
||||
type: { |
||||
type: String, |
||||
default: '' |
||||
}, |
||||
color: { |
||||
type: String, |
||||
default: '#333333' |
||||
}, |
||||
size: { |
||||
type: [Number, String], |
||||
default: 16 |
||||
}, |
||||
fontFamily: { |
||||
type: String, |
||||
default: '' |
||||
} |
||||
}, |
||||
data() { |
||||
return {}; |
||||
}, |
||||
computed: { |
||||
unicode() : string { |
||||
let codes = fontData.find((item : IconsDataItem) : boolean => { return item.font_class == this.type }) |
||||
if (codes !== null) { |
||||
return codes.unicode |
||||
} |
||||
return '' |
||||
}, |
||||
iconSize() : string { |
||||
const size = this.size |
||||
if (typeof size == 'string') { |
||||
const reg = /^[0-9]*$/g |
||||
return reg.test(size as string) ? '' + size + 'px' : '' + size; |
||||
// return '' + this.size |
||||
} |
||||
return this.getFontSize(size as number) |
||||
}, |
||||
styleObj() : UTSJSONObject { |
||||
if (this.fontFamily !== '') { |
||||
return { color: this.color, fontSize: this.iconSize, fontFamily: this.fontFamily } |
||||
} |
||||
return { color: this.color, fontSize: this.iconSize } |
||||
} |
||||
}, |
||||
created() { }, |
||||
methods: { |
||||
/** |
||||
* 字体大小 |
||||
*/ |
||||
getFontSize(size : number) : string { |
||||
return size + 'px'; |
||||
}, |
||||
}, |
||||
} |
||||
</script> |
||||
|
||||
<style scoped> |
||||
@font-face { |
||||
font-family: UniIconsFontFamily; |
||||
src: url('./uniicons.ttf'); |
||||
} |
||||
|
||||
.uni-icons { |
||||
font-family: UniIconsFontFamily; |
||||
font-size: 18px; |
||||
font-style: normal; |
||||
color: #333; |
||||
} |
||||
</style> |
||||
|
||||
@ -1,110 +1,110 @@ |
||||
<template> |
||||
<!-- #ifdef APP-NVUE --> |
||||
<text :style="styleObj" class="uni-icons" @click="_onClick">{{unicode}}</text> |
||||
<!-- #endif --> |
||||
<!-- #ifndef APP-NVUE --> |
||||
<text :style="styleObj" class="uni-icons" :class="['uniui-'+type,customPrefix,customPrefix?type:'']" @click="_onClick"> |
||||
<slot></slot> |
||||
</text> |
||||
<!-- #endif --> |
||||
</template> |
||||
|
||||
<script> |
||||
import { fontData } from './uniicons_file_vue.js'; |
||||
|
||||
const getVal = (val) => { |
||||
const reg = /^[0-9]*$/g |
||||
return (typeof val === 'number' || reg.test(val)) ? val + 'px' : val; |
||||
} |
||||
|
||||
// #ifdef APP-NVUE |
||||
var domModule = weex.requireModule('dom'); |
||||
import iconUrl from './uniicons.ttf' |
||||
domModule.addRule('fontFace', { |
||||
'fontFamily': "uniicons", |
||||
'src': "url('" + iconUrl + "')" |
||||
}); |
||||
// #endif |
||||
|
||||
/** |
||||
* Icons 图标 |
||||
* @description 用于展示 icons 图标 |
||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=28 |
||||
* @property {Number} size 图标大小 |
||||
* @property {String} type 图标图案，参考示例 |
||||
* @property {String} color 图标颜色 |
||||
* @property {String} customPrefix 自定义图标 |
||||
* @event {Function} click 点击 Icon 触发事件 |
||||
*/ |
||||
export default { |
||||
name: 'UniIcons', |
||||
emits: ['click'], |
||||
props: { |
||||
type: { |
||||
type: String, |
||||
default: '' |
||||
}, |
||||
color: { |
||||
type: String, |
||||
default: '#333333' |
||||
}, |
||||
size: { |
||||
type: [Number, String], |
||||
default: 16 |
||||
}, |
||||
customPrefix: { |
||||
type: String, |
||||
default: '' |
||||
}, |
||||
fontFamily: { |
||||
type: String, |
||||
default: '' |
||||
} |
||||
}, |
||||
data() { |
||||
return { |
||||
icons: fontData |
||||
} |
||||
}, |
||||
computed: { |
||||
unicode() { |
||||
let code = this.icons.find(v => v.font_class === this.type) |
||||
if (code) { |
||||
return code.unicode |
||||
} |
||||
return '' |
||||
}, |
||||
iconSize() { |
||||
return getVal(this.size) |
||||
}, |
||||
styleObj() { |
||||
if (this.fontFamily !== '') { |
||||
return `color: ${this.color}; font-size: ${this.iconSize}; font-family: ${this.fontFamily};` |
||||
} |
||||
return `color: ${this.color}; font-size: ${this.iconSize};` |
||||
} |
||||
}, |
||||
methods: { |
||||
_onClick() { |
||||
this.$emit('click') |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss"> |
||||
/* #ifndef APP-NVUE */ |
||||
@import './uniicons.css'; |
||||
|
||||
@font-face { |
||||
font-family: uniicons; |
||||
src: url('./uniicons.ttf'); |
||||
} |
||||
|
||||
/* #endif */ |
||||
.uni-icons { |
||||
font-family: uniicons; |
||||
text-decoration: none; |
||||
text-align: center; |
||||
} |
||||
<template> |
||||
<!-- #ifdef APP-NVUE --> |
||||
<text :style="styleObj" class="uni-icons" @click="_onClick">{{unicode}}</text> |
||||
<!-- #endif --> |
||||
<!-- #ifndef APP-NVUE --> |
||||
<text :style="styleObj" class="uni-icons" :class="['uniui-'+type,customPrefix,customPrefix?type:'']" @click="_onClick"> |
||||
<slot></slot> |
||||
</text> |
||||
<!-- #endif --> |
||||
</template> |
||||
|
||||
<script> |
||||
import { fontData } from './uniicons_file_vue.js'; |
||||
|
||||
const getVal = (val) => { |
||||
const reg = /^[0-9]*$/g |
||||
return (typeof val === 'number' || reg.test(val)) ? val + 'px' : val; |
||||
} |
||||
|
||||
// #ifdef APP-NVUE |
||||
var domModule = weex.requireModule('dom'); |
||||
import iconUrl from './uniicons.ttf' |
||||
domModule.addRule('fontFace', { |
||||
'fontFamily': "uniicons", |
||||
'src': "url('" + iconUrl + "')" |
||||
}); |
||||
// #endif |
||||
|
||||
/** |
||||
* Icons 图标 |
||||
* @description 用于展示 icons 图标 |
||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=28 |
||||
* @property {Number} size 图标大小 |
||||
* @property {String} type 图标图案，参考示例 |
||||
* @property {String} color 图标颜色 |
||||
* @property {String} customPrefix 自定义图标 |
||||
* @event {Function} click 点击 Icon 触发事件 |
||||
*/ |
||||
export default { |
||||
name: 'UniIcons', |
||||
emits: ['click'], |
||||
props: { |
||||
type: { |
||||
type: String, |
||||
default: '' |
||||
}, |
||||
color: { |
||||
type: String, |
||||
default: '#333333' |
||||
}, |
||||
size: { |
||||
type: [Number, String], |
||||
default: 16 |
||||
}, |
||||
customPrefix: { |
||||
type: String, |
||||
default: '' |
||||
}, |
||||
fontFamily: { |
||||
type: String, |
||||
default: '' |
||||
} |
||||
}, |
||||
data() { |
||||
return { |
||||
icons: fontData |
||||
} |
||||
}, |
||||
computed: { |
||||
unicode() { |
||||
let code = this.icons.find(v => v.font_class === this.type) |
||||
if (code) { |
||||
return code.unicode |
||||
} |
||||
return '' |
||||
}, |
||||
iconSize() { |
||||
return getVal(this.size) |
||||
}, |
||||
styleObj() { |
||||
if (this.fontFamily !== '') { |
||||
return `color: ${this.color}; font-size: ${this.iconSize}; font-family: ${this.fontFamily};` |
||||
} |
||||
return `color: ${this.color}; font-size: ${this.iconSize};` |
||||
} |
||||
}, |
||||
methods: { |
||||
_onClick() { |
||||
this.$emit('click') |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="scss"> |
||||
/* #ifndef APP-NVUE */ |
||||
@import './uniicons.css'; |
||||
|
||||
@font-face { |
||||
font-family: uniicons; |
||||
src: url('./uniicons.ttf'); |
||||
} |
||||
|
||||
/* #endif */ |
||||
.uni-icons { |
||||
font-family: uniicons; |
||||
text-decoration: none; |
||||
text-align: center; |
||||
} |
||||
</style> |
||||
|
||||
Loading…
Reference in new issue