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> |
<template> |
||||||
<text class="uni-icons" :style="styleObj"> |
<text class="uni-icons" :style="styleObj"> |
||||||
<slot>{{unicode}}</slot> |
<slot>{{unicode}}</slot> |
||||||
</text> |
</text> |
||||||
</template> |
</template> |
||||||
|
|
||||||
<script> |
<script> |
||||||
import { fontData, IconsDataItem } from './uniicons_file' |
import { fontData, IconsDataItem } from './uniicons_file' |
||||||
|
|
||||||
/** |
/** |
||||||
* Icons 图标 |
* Icons 图标 |
||||||
* @description 用于展示 icon 图标 |
* @description 用于展示 icon 图标 |
||||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=28 |
* @tutorial https://ext.dcloud.net.cn/plugin?id=28 |
||||||
* @property {Number,String} size 图标大小 |
* @property {Number,String} size 图标大小 |
||||||
* @property {String} type 图标图案，参考示例 |
* @property {String} type 图标图案，参考示例 |
||||||
* @property {String} color 图标颜色 |
* @property {String} color 图标颜色 |
||||||
* @property {String} customPrefix 自定义图标 |
* @property {String} customPrefix 自定义图标 |
||||||
* @event {Function} click 点击 Icon 触发事件 |
* @event {Function} click 点击 Icon 触发事件 |
||||||
*/ |
*/ |
||||||
export default { |
export default { |
||||||
name: "uni-icons", |
name: "uni-icons", |
||||||
props: { |
props: { |
||||||
type: { |
type: { |
||||||
type: String, |
type: String, |
||||||
default: '' |
default: '' |
||||||
}, |
}, |
||||||
color: { |
color: { |
||||||
type: String, |
type: String, |
||||||
default: '#333333' |
default: '#333333' |
||||||
}, |
}, |
||||||
size: { |
size: { |
||||||
type: [Number, String], |
type: [Number, String], |
||||||
default: 16 |
default: 16 |
||||||
}, |
}, |
||||||
fontFamily: { |
fontFamily: { |
||||||
type: String, |
type: String, |
||||||
default: '' |
default: '' |
||||||
} |
} |
||||||
}, |
}, |
||||||
data() { |
data() { |
||||||
return {}; |
return {}; |
||||||
}, |
}, |
||||||
computed: { |
computed: { |
||||||
unicode() : string { |
unicode() : string { |
||||||
let codes = fontData.find((item : IconsDataItem) : boolean => { return item.font_class == this.type }) |
let codes = fontData.find((item : IconsDataItem) : boolean => { return item.font_class == this.type }) |
||||||
if (codes !== null) { |
if (codes !== null) { |
||||||
return codes.unicode |
return codes.unicode |
||||||
} |
} |
||||||
return '' |
return '' |
||||||
}, |
}, |
||||||
iconSize() : string { |
iconSize() : string { |
||||||
const size = this.size |
const size = this.size |
||||||
if (typeof size == 'string') { |
if (typeof size == 'string') { |
||||||
const reg = /^[0-9]*$/g |
const reg = /^[0-9]*$/g |
||||||
return reg.test(size as string) ? '' + size + 'px' : '' + size; |
return reg.test(size as string) ? '' + size + 'px' : '' + size; |
||||||
// return '' + this.size |
// return '' + this.size |
||||||
} |
} |
||||||
return this.getFontSize(size as number) |
return this.getFontSize(size as number) |
||||||
}, |
}, |
||||||
styleObj() : UTSJSONObject { |
styleObj() : UTSJSONObject { |
||||||
if (this.fontFamily !== '') { |
if (this.fontFamily !== '') { |
||||||
return { color: this.color, fontSize: this.iconSize, fontFamily: this.fontFamily } |
return { color: this.color, fontSize: this.iconSize, fontFamily: this.fontFamily } |
||||||
} |
} |
||||||
return { color: this.color, fontSize: this.iconSize } |
return { color: this.color, fontSize: this.iconSize } |
||||||
} |
} |
||||||
}, |
}, |
||||||
created() { }, |
created() { }, |
||||||
methods: { |
methods: { |
||||||
/** |
/** |
||||||
* 字体大小 |
* 字体大小 |
||||||
*/ |
*/ |
||||||
getFontSize(size : number) : string { |
getFontSize(size : number) : string { |
||||||
return size + 'px'; |
return size + 'px'; |
||||||
}, |
}, |
||||||
}, |
}, |
||||||
} |
} |
||||||
</script> |
</script> |
||||||
|
|
||||||
<style scoped> |
<style scoped> |
||||||
@font-face { |
@font-face { |
||||||
font-family: UniIconsFontFamily; |
font-family: UniIconsFontFamily; |
||||||
src: url('./uniicons.ttf'); |
src: url('./uniicons.ttf'); |
||||||
} |
} |
||||||
|
|
||||||
.uni-icons { |
.uni-icons { |
||||||
font-family: UniIconsFontFamily; |
font-family: UniIconsFontFamily; |
||||||
font-size: 18px; |
font-size: 18px; |
||||||
font-style: normal; |
font-style: normal; |
||||||
color: #333; |
color: #333; |
||||||
} |
} |
||||||
</style> |
</style> |
||||||
|
|||||||
@ -1,110 +1,110 @@ |
|||||||
<template> |
<template> |
||||||
<!-- #ifdef APP-NVUE --> |
<!-- #ifdef APP-NVUE --> |
||||||
<text :style="styleObj" class="uni-icons" @click="_onClick">{{unicode}}</text> |
<text :style="styleObj" class="uni-icons" @click="_onClick">{{unicode}}</text> |
||||||
<!-- #endif --> |
<!-- #endif --> |
||||||
<!-- #ifndef APP-NVUE --> |
<!-- #ifndef APP-NVUE --> |
||||||
<text :style="styleObj" class="uni-icons" :class="['uniui-'+type,customPrefix,customPrefix?type:'']" @click="_onClick"> |
<text :style="styleObj" class="uni-icons" :class="['uniui-'+type,customPrefix,customPrefix?type:'']" @click="_onClick"> |
||||||
<slot></slot> |
<slot></slot> |
||||||
</text> |
</text> |
||||||
<!-- #endif --> |
<!-- #endif --> |
||||||
</template> |
</template> |
||||||
|
|
||||||
<script> |
<script> |
||||||
import { fontData } from './uniicons_file_vue.js'; |
import { fontData } from './uniicons_file_vue.js'; |
||||||
|
|
||||||
const getVal = (val) => { |
const getVal = (val) => { |
||||||
const reg = /^[0-9]*$/g |
const reg = /^[0-9]*$/g |
||||||
return (typeof val === 'number' || reg.test(val)) ? val + 'px' : val; |
return (typeof val === 'number' || reg.test(val)) ? val + 'px' : val; |
||||||
} |
} |
||||||
|
|
||||||
// #ifdef APP-NVUE |
// #ifdef APP-NVUE |
||||||
var domModule = weex.requireModule('dom'); |
var domModule = weex.requireModule('dom'); |
||||||
import iconUrl from './uniicons.ttf' |
import iconUrl from './uniicons.ttf' |
||||||
domModule.addRule('fontFace', { |
domModule.addRule('fontFace', { |
||||||
'fontFamily': "uniicons", |
'fontFamily': "uniicons", |
||||||
'src': "url('" + iconUrl + "')" |
'src': "url('" + iconUrl + "')" |
||||||
}); |
}); |
||||||
// #endif |
// #endif |
||||||
|
|
||||||
/** |
/** |
||||||
* Icons 图标 |
* Icons 图标 |
||||||
* @description 用于展示 icons 图标 |
* @description 用于展示 icons 图标 |
||||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=28 |
* @tutorial https://ext.dcloud.net.cn/plugin?id=28 |
||||||
* @property {Number} size 图标大小 |
* @property {Number} size 图标大小 |
||||||
* @property {String} type 图标图案，参考示例 |
* @property {String} type 图标图案，参考示例 |
||||||
* @property {String} color 图标颜色 |
* @property {String} color 图标颜色 |
||||||
* @property {String} customPrefix 自定义图标 |
* @property {String} customPrefix 自定义图标 |
||||||
* @event {Function} click 点击 Icon 触发事件 |
* @event {Function} click 点击 Icon 触发事件 |
||||||
*/ |
*/ |
||||||
export default { |
export default { |
||||||
name: 'UniIcons', |
name: 'UniIcons', |
||||||
emits: ['click'], |
emits: ['click'], |
||||||
props: { |
props: { |
||||||
type: { |
type: { |
||||||
type: String, |
type: String, |
||||||
default: '' |
default: '' |
||||||
}, |
}, |
||||||
color: { |
color: { |
||||||
type: String, |
type: String, |
||||||
default: '#333333' |
default: '#333333' |
||||||
}, |
}, |
||||||
size: { |
size: { |
||||||
type: [Number, String], |
type: [Number, String], |
||||||
default: 16 |
default: 16 |
||||||
}, |
}, |
||||||
customPrefix: { |
customPrefix: { |
||||||
type: String, |
type: String, |
||||||
default: '' |
default: '' |
||||||
}, |
}, |
||||||
fontFamily: { |
fontFamily: { |
||||||
type: String, |
type: String, |
||||||
default: '' |
default: '' |
||||||
} |
} |
||||||
}, |
}, |
||||||
data() { |
data() { |
||||||
return { |
return { |
||||||
icons: fontData |
icons: fontData |
||||||
} |
} |
||||||
}, |
}, |
||||||
computed: { |
computed: { |
||||||
unicode() { |
unicode() { |
||||||
let code = this.icons.find(v => v.font_class === this.type) |
let code = this.icons.find(v => v.font_class === this.type) |
||||||
if (code) { |
if (code) { |
||||||
return code.unicode |
return code.unicode |
||||||
} |
} |
||||||
return '' |
return '' |
||||||
}, |
}, |
||||||
iconSize() { |
iconSize() { |
||||||
return getVal(this.size) |
return getVal(this.size) |
||||||
}, |
}, |
||||||
styleObj() { |
styleObj() { |
||||||
if (this.fontFamily !== '') { |
if (this.fontFamily !== '') { |
||||||
return `color: ${this.color}; font-size: ${this.iconSize}; font-family: ${this.fontFamily};` |
return `color: ${this.color}; font-size: ${this.iconSize}; font-family: ${this.fontFamily};` |
||||||
} |
} |
||||||
return `color: ${this.color}; font-size: ${this.iconSize};` |
return `color: ${this.color}; font-size: ${this.iconSize};` |
||||||
} |
} |
||||||
}, |
}, |
||||||
methods: { |
methods: { |
||||||
_onClick() { |
_onClick() { |
||||||
this.$emit('click') |
this.$emit('click') |
||||||
} |
} |
||||||
} |
} |
||||||
} |
} |
||||||
</script> |
</script> |
||||||
|
|
||||||
<style lang="scss"> |
<style lang="scss"> |
||||||
/* #ifndef APP-NVUE */ |
/* #ifndef APP-NVUE */ |
||||||
@import './uniicons.css'; |
@import './uniicons.css'; |
||||||
|
|
||||||
@font-face { |
@font-face { |
||||||
font-family: uniicons; |
font-family: uniicons; |
||||||
src: url('./uniicons.ttf'); |
src: url('./uniicons.ttf'); |
||||||
} |
} |
||||||
|
|
||||||
/* #endif */ |
/* #endif */ |
||||||
.uni-icons { |
.uni-icons { |
||||||
font-family: uniicons; |
font-family: uniicons; |
||||||
text-decoration: none; |
text-decoration: none; |
||||||
text-align: center; |
text-align: center; |
||||||
} |
} |
||||||
</style> |
</style> |
||||||
|
|||||||
Loading…
Reference in new issue