diff --git a/demo/app.json b/demo/app.json
index 98e63b73c..32af268b6 100644
--- a/demo/app.json
+++ b/demo/app.json
@@ -29,7 +29,7 @@
"pages/DatePicker/index",
"pages/Input/index",
"pages/InputSearchBar/index",
- "pages/InputBase/index",
+ "pages/InputTextarea/index",
"pages/Badge/index",
"pages/Button/index",
"pages/ButtonInline/index",
diff --git a/demo/pages/Form/index.axml b/demo/pages/Form/index.axml
index c22b19227..2ab56d373 100644
--- a/demo/pages/Form/index.axml
+++ b/demo/pages/Form/index.axml
@@ -94,6 +94,15 @@
ref="handleRef"
/>
+
+
RMB
+
+
+
+
+
+
+
+
+
diff --git a/demo/pages/Input/index.js b/demo/pages/Input/index.js
index 1910d8ce0..2f074047c 100644
--- a/demo/pages/Input/index.js
+++ b/demo/pages/Input/index.js
@@ -25,4 +25,10 @@ Page({
value: '',
});
},
+ handleRef(input) {
+ this.input = input;
+ },
+ clearByInputRef() {
+ this.input.update('');
+ }
});
diff --git a/demo/pages/Input/index.less b/demo/pages/Input/index.less
index 8d84cbec7..204deeccb 100644
--- a/demo/pages/Input/index.less
+++ b/demo/pages/Input/index.less
@@ -9,7 +9,6 @@
.money {
width: 180px;
- margin-bottom: 80px;
}
.border {
diff --git a/demo/pages/InputBase/index.axml b/demo/pages/InputBase/index.axml
deleted file mode 100644
index 31241b762..000000000
--- a/demo/pages/InputBase/index.axml
+++ /dev/null
@@ -1,42 +0,0 @@
-
-
-
-
-
-
-
-
-
-
- 只能输入number: {{value}}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/demo/pages/InputBase/index.json b/demo/pages/InputBase/index.json
deleted file mode 100644
index bfddc9188..000000000
--- a/demo/pages/InputBase/index.json
+++ /dev/null
@@ -1,8 +0,0 @@
-{
- "defaultTitle": "InputBase",
- "usingComponents": {
- "input": "../../../src/Input/InputBase/index",
- "container": "../../../src/Container/index",
- "button": "../../../src/Button/index"
- }
-}
diff --git a/demo/pages/InputBase/index.less b/demo/pages/InputBase/index.less
deleted file mode 100644
index 52ef187d4..000000000
--- a/demo/pages/InputBase/index.less
+++ /dev/null
@@ -1,12 +0,0 @@
-button {
- margin: 4px;
-}
-
-.input-container {
- display: flex;
- align-items: center;
-}
-
-.value {
- margin: 8px 0 0 5px;
-}
\ No newline at end of file
diff --git a/demo/pages/InputTextarea/index.axml b/demo/pages/InputTextarea/index.axml
new file mode 100644
index 000000000..32afd28e2
--- /dev/null
+++ b/demo/pages/InputTextarea/index.axml
@@ -0,0 +1,56 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/demo/pages/InputBase/index.js b/demo/pages/InputTextarea/index.js
similarity index 50%
rename from demo/pages/InputBase/index.js
rename to demo/pages/InputTextarea/index.js
index 8db7e107b..2f074047c 100644
--- a/demo/pages/InputBase/index.js
+++ b/demo/pages/InputTextarea/index.js
@@ -1,13 +1,25 @@
Page({
data: {
- value: undefined,
- focus: false,
+ value: '',
+ money: '',
},
- randomValue() {
+ onChange(value, e) {
+ console.log(value, e);
+ },
+ handleChange(value) {
this.setData({
- value: Math.random(),
+ value,
});
},
+ handleMoney(value) {
+ console.log(value);
+ if (isNaN(Number(value))) {
+ return;
+ }
+ this.setData({
+ money: value,
+ })
+ },
clear() {
this.setData({
value: '',
@@ -16,19 +28,6 @@ Page({
handleRef(input) {
this.input = input;
},
- onChange(value) {
- // setTimeout(() => {})
- // this.input.update(value + '1');
- console.log(value);
- },
- handleChange(value) {
- console.log(value);
- if (!isNaN(Number(value))) {
- this.setData({
- value,
- });
- }
- },
clearByInputRef() {
this.input.update('');
}
diff --git a/demo/pages/InputTextarea/index.json b/demo/pages/InputTextarea/index.json
new file mode 100644
index 000000000..204ee19a6
--- /dev/null
+++ b/demo/pages/InputTextarea/index.json
@@ -0,0 +1,8 @@
+{
+ "defaultTitle": "Input",
+ "usingComponents": {
+ "textarea": "../../../src/Input/Textarea/index",
+ "button": "../../../src/Button/index",
+ "container": "../../../src/Container/index"
+ }
+}
diff --git a/demo/pages/InputTextarea/index.less b/demo/pages/InputTextarea/index.less
new file mode 100644
index 000000000..4881c44ea
--- /dev/null
+++ b/demo/pages/InputTextarea/index.less
@@ -0,0 +1,9 @@
+@import "../../../src/style/themes/color.less";
+
+textarea {
+ min-height: 100px;
+}
+
+button {
+ margin-top: 8px;
+}
diff --git a/src/Form/FormInput/index.axml b/src/Form/FormInput/index.axml
index bb05c6ef5..9c8073019 100644
--- a/src/Form/FormInput/index.axml
+++ b/src/Form/FormInput/index.axml
@@ -1,5 +1,3 @@
-
-
diff --git a/src/Form/FormInput/index.less b/src/Form/FormInput/index.less
index 884eee1a0..e69de29bb 100644
--- a/src/Form/FormInput/index.less
+++ b/src/Form/FormInput/index.less
@@ -1,85 +0,0 @@
-@import (reference) "./variable.less";
-
-@inputItemPrefix: ant-input-item;
-.@{inputItemPrefix} {
- display: flex;
- align-items: center;
- background: @COLOR_CARD;
- // &-disabled {
- // opacity: 0.4;
- // }
- &-line {
- position: relative;
- flex: 1;
- display: flex;
- align-items: center;
- overflow: hidden;
- }
- &-extra {
- margin-right: 24 * @rpx;
- margin-left: 16 * @rpx;
- &:empty {
- display: none;
- }
- }
- &-layer {
- display: flex;
- flex: 1;
- &-vertical {
- flex-direction: column;
- .ant-input-item-label {
- align-self: flex-start;
- font-size: 30 * @rpx;
- color: red;
- }
- .a-input-placeholder {
- margin-left: -6 * @rpx;
- }
- .@{inputItemPrefix}-content {
- align-self: stretch;
- color: #333;
- font-size: 30 * @rpx;
- }
- }
- }
- &-content {
- flex: 1;
- display: flex;
- align-self: center;
- padding: 0;
- font-size: 34 * @rpx;
- text-align: left;
- color: @input-item-color;
- background: @COLOR_CARD;
- .a-input-placeholder {
- font-size: 34 * @rpx;
- color: @input-item-placeholder-color;
- }
- }
-
- &-content .a-input-wrap {
- flex: 1;
- }
-
- &-clear {
- display: flex;
- justify-content: center;
- align-items: center;
- border-radius: 16 * @rpx;
- &-icon {
- color: @COLOR_TEXT_WEAK;
- font-size: 34 * @rpx;
- }
- }
-
- &-clear.show {
- visibility: visible;
- }
- &-clear.hidden {
- visibility: hidden;
- pointer-events: none;
- }
- &-placeholder-base {
- color: @input-item-placeholder-color;
- }
-}
diff --git a/src/Form/FormInput/index.sjs b/src/Form/FormInput/index.sjs
deleted file mode 100644
index 6c8fc2e0a..000000000
--- a/src/Form/FormInput/index.sjs
+++ /dev/null
@@ -1,5 +0,0 @@
-function getFocus(focus, selfFocus) {
- return focus ? (typeof selfFocus === 'undefined' ? true : selfFocus) : selfFocus;
-}
-
-export default { getFocus };
diff --git a/src/Form/FormInput/index.ts b/src/Form/FormInput/index.ts
index 6c8114dc9..ecc824714 100644
--- a/src/Form/FormInput/index.ts
+++ b/src/Form/FormInput/index.ts
@@ -1,78 +1,51 @@
import { FormInputDefaultProps } from './props';
+import { createForm } from '../form';
import fmtEvent from '../../_util/fmtEvent';
Component({
props: FormInputDefaultProps,
- data: {
- formData: {
- value: undefined,
- status: 'default',
- errors: [],
- },
- },
- ref() {
- const formItemRef = {
- setFormData: (values) => {
- this.setData({
- ...this.data,
- formData: {
- ...this.data.formData,
- ...values,
- }
- });
- this.input.update(this.data.formData.value);
- },
- getFormData: () => {
- return this.data.formData;
- },
- on: (callback: (trigger, value) => void) => {
- this.emit = callback;
- },
- getProps: () => {
- return this.props;
- },
- };
- return formItemRef;
- },
- didUnmount() {
- this.emit('didUnmount');
- },
- deriveDataFromProps(nextProps) {
- this.emit('deriveDataFromProps', nextProps);
- },
- input: { update: (value: any) => {} },
+ mixins: [createForm()],
methods: {
handleRef(input) {
this.input = input;
},
+ setFormData(values) {
+ this.setData({
+ ...this.data,
+ formData: {
+ ...this.data.formData,
+ ...values,
+ }
+ });
+ this.input.update(this.data.formData.value);
+ },
onChange(value, e) {
this.emit('onChange', value);
if (this.props.onChange) {
this.props.onChange(value, fmtEvent(this.props, e));
}
},
- onBlur(e) {
+ onBlur(value, e) {
if (this.props.onBlur) {
- this.props.onBlur(fmtEvent(this.props, e));
+ this.props.onBlur(value, fmtEvent(this.props, e));
}
},
- onFocus(e) {
+ onFocus(value, e) {
if (this.props.onChange) {
- this.props.onFocus(fmtEvent(this.props, e));
+ this.props.onFocus(value, fmtEvent(this.props, e));
}
},
- onConfirm(e) {
+ onConfirm(value, e) {
if (this.props.onConfirm) {
- this.props.onConfirm(fmtEvent(this.props, e));
+ this.props.onConfirm(value, fmtEvent(this.props, e));
}
},
- onClear(e) {
+ onClear(value, e) {
this.emit('onChange', '');
if (this.props.onChange) {
- this.props.onChange('', fmtEvent(this.props, e));
+ this.props.onChange(value, fmtEvent(this.props, e));
}
},
- emit(trigger, value?: any) {},
}
});
diff --git a/src/Form/FormInput/props.d.ts b/src/Form/FormInput/props.d.ts
index 5bebe1d5b..b10950f2e 100644
--- a/src/Form/FormInput/props.d.ts
+++ b/src/Form/FormInput/props.d.ts
@@ -2,7 +2,7 @@ import { FormItemProps } from '../FormItem/props';
import { InputProps } from '../../Input/props';
-export interface FormInputProps extends Omit, FormItemProps {
+export interface FormInputProps extends Omit, FormItemProps {
}
export declare const FormInputDefaultProps: Partial;
diff --git a/src/Form/FormTextarea/index.axml b/src/Form/FormTextarea/index.axml
new file mode 100644
index 000000000..71a08b569
--- /dev/null
+++ b/src/Form/FormTextarea/index.axml
@@ -0,0 +1,37 @@
+
+
+
+
+ {{extra}}
+
+
+
+
+
+
diff --git a/src/Form/FormTextarea/index.json b/src/Form/FormTextarea/index.json
new file mode 100644
index 000000000..b6d04b014
--- /dev/null
+++ b/src/Form/FormTextarea/index.json
@@ -0,0 +1,7 @@
+{
+ "component": true,
+ "usingComponents": {
+ "form-item": "../FormItem/index",
+ "textarea": "../../Input/Textarea/index"
+ }
+}
\ No newline at end of file
diff --git a/src/Form/FormTextarea/index.less b/src/Form/FormTextarea/index.less
new file mode 100644
index 000000000..e69de29bb
diff --git a/src/Form/FormTextarea/index.ts b/src/Form/FormTextarea/index.ts
new file mode 100644
index 000000000..dee2efa29
--- /dev/null
+++ b/src/Form/FormTextarea/index.ts
@@ -0,0 +1,51 @@
+import { FormTextareaDefaultProps } from './props';
+import { createForm } from '../form';
+import fmtEvent from '../../_util/fmtEvent';
+
+
+Component({
+ props: FormTextareaDefaultProps,
+ mixins: [createForm()],
+ methods: {
+ handleRef(input) {
+ this.input = input;
+ },
+ setFormData(values) {
+ this.setData({
+ ...this.data,
+ formData: {
+ ...this.data.formData,
+ ...values,
+ }
+ });
+ this.input.update(this.data.formData.value);
+ },
+ onChange(value, e) {
+ this.emit('onChange', value);
+ if (this.props.onChange) {
+ this.props.onChange(value, fmtEvent(this.props, e));
+ }
+ },
+ onBlur(value, e) {
+ if (this.props.onBlur) {
+ this.props.onBlur(value, fmtEvent(this.props, e));
+ }
+ },
+ onFocus(value, e) {
+ if (this.props.onChange) {
+ this.props.onFocus(value, fmtEvent(this.props, e));
+ }
+ },
+ onConfirm(value, e) {
+ if (this.props.onConfirm) {
+ this.props.onConfirm(value, fmtEvent(this.props, e));
+ }
+ },
+ onClear(value, e) {
+ this.emit('onChange', '');
+ if (this.props.onChange) {
+ this.props.onChange(value, fmtEvent(this.props, e));
+ }
+ },
+ }
+});
diff --git a/src/Form/FormTextarea/props.d.ts b/src/Form/FormTextarea/props.d.ts
new file mode 100644
index 000000000..bd10a63a9
--- /dev/null
+++ b/src/Form/FormTextarea/props.d.ts
@@ -0,0 +1,8 @@
+import { FormItemProps } from '../FormItem/props';
+import { TextareaProps } from '../../Input/Textarea/props';
+
+
+export interface FormTextareaProps extends Omit, FormItemProps {
+}
+
+export declare const FormTextareaDefaultProps: Partial;
diff --git a/src/Form/FormTextarea/props.js b/src/Form/FormTextarea/props.js
new file mode 100644
index 000000000..80600bd8d
--- /dev/null
+++ b/src/Form/FormTextarea/props.js
@@ -0,0 +1,2 @@
+export const FormInputDefaultProps = {
+};
diff --git a/src/Form/form.ts b/src/Form/form.ts
index bdcdb28d9..c097dd840 100644
--- a/src/Form/form.ts
+++ b/src/Form/form.ts
@@ -544,3 +544,42 @@ export class Form {
});
}
}
+
+export function createForm() {
+ return {
+ data: {
+ formData: {
+ value: undefined,
+ status: 'default',
+ errors: [],
+ },
+ },
+ didUnmount() {
+ this.emit('didUnmount');
+ },
+ deriveDataFromProps(nextProps) {
+ this.emit('deriveDataFromProps', nextProps);
+ },
+ methods: {
+ emit(trigger: EventTrigger, value?: Value) {},
+ setFormData(values: Values) {
+ this.setData({
+ ...this.data,
+ formData: {
+ ...this.data.formData,
+ ...values,
+ }
+ })
+ },
+ getFormData() {
+ return this.data.formData;
+ },
+ on(callback: (trigger: EventTrigger, value?: Value) => void) {
+ this.emit = callback;
+ },
+ getProps() {
+ return this.props;
+ },
+ }
+ }
+}
diff --git a/src/Form/index.md b/src/Form/index.md
index a2a066ddd..88484deba 100644
--- a/src/Form/index.md
+++ b/src/Form/index.md
@@ -88,17 +88,14 @@ Form 表单。包含数据录入、校验以及对应样式
}
```
-
### FormInput
-同 Input,添加:
+同 Input
-| 属性 | 说明 | 类型 | 默认值 |
-| -----|-----|-----|-----|
-| inputClassName | 对应Input组件className | string | - |
-| inputStyle | 对应Input组件style | string | - |
+### FormTextarea
+同 Textarea
### FormSwitch
-同 Switch,添加
+同 Switch
### FormStepper
同 Switch,添加:
diff --git a/src/Input/InputBase/index.axml b/src/Input/InputBase/index.axml
deleted file mode 100644
index 2698a8f23..000000000
--- a/src/Input/InputBase/index.axml
+++ /dev/null
@@ -1,27 +0,0 @@
-
diff --git a/src/Input/InputBase/index.json b/src/Input/InputBase/index.json
deleted file mode 100644
index 467ce2945..000000000
--- a/src/Input/InputBase/index.json
+++ /dev/null
@@ -1,3 +0,0 @@
-{
- "component": true
-}
diff --git a/src/Input/InputBase/props.d.ts b/src/Input/InputBase/props.d.ts
deleted file mode 100644
index b85133406..000000000
--- a/src/Input/InputBase/props.d.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-import { IBaseProps } from '../../_base';
-/**
- * @description 输入框。
- */
-
-export interface InputBaseProps extends IBaseProps {
- value?: string;
- defaultValue?: string;
- placeholder?: string;
- placeholderClassName?: string;
- placeholderStyle?: string;
- allowClear?: boolean;
- confirmType?: string;
- cursor?: number;
- maxLength?: number;
- password?: boolean;
- onChange?: (value: string, e: any) => void;
- onBlur?: (e: any) => void;
- onFocus?: (e: any) => void;
- onConfirm?: (e: any) => void;
-}
-export declare const InputBaseDefaultProps: Partial;
diff --git a/src/Input/InputBase/props.js b/src/Input/InputBase/props.js
deleted file mode 100644
index 3834e04e3..000000000
--- a/src/Input/InputBase/props.js
+++ /dev/null
@@ -1,3 +0,0 @@
-export const InputDefaultProps = {
-
-};
diff --git a/src/Input/InputBlur/index.ts b/src/Input/InputBlur/index.ts
index 28e73f09c..75986acd6 100644
--- a/src/Input/InputBlur/index.ts
+++ b/src/Input/InputBlur/index.ts
@@ -30,23 +30,26 @@ Component({
}
},
onFocus(e) {
+ const value = e.detail.value;
this.focus = true;
if (this.props.onFocus) {
- this.props.onFocus(fmtEvent(this.props, e));
+ this.props.onFocus(value, fmtEvent(this.props, e));
}
},
onBlur(e) {
+ const value = e.detail.value;
this.focus = false;
if (this.isControlled()) {
this.update(this.props.value);
}
if (this.props.onBlur) {
- this.props.onBlur(fmtEvent(this.props, e));
+ this.props.onBlur(value, fmtEvent(this.props, e));
}
},
onConfirm(e) {
+ const value = e.detail.value;
if (this.props.onConfirm) {
- this.props.onConfirm(fmtEvent(this.props, e));
+ this.props.onConfirm(value, fmtEvent(this.props, e));
}
},
}
diff --git a/src/Input/InputBlur/props.d.ts b/src/Input/InputBlur/props.d.ts
index c2f8a0dce..428fa75e3 100644
--- a/src/Input/InputBlur/props.d.ts
+++ b/src/Input/InputBlur/props.d.ts
@@ -9,14 +9,20 @@ export interface InputBlurProps extends IBaseProps {
placeholder?: string;
placeholderClassName?: string;
placeholderStyle?: string;
- allowClear?: boolean;
+ enableNative?: boolean;
confirmType?: string;
+ confirmHold?: string;
+ alwaysSystem?: boolean;
+ selectionStart?: number;
+ selectionEnd?: number;
cursor?: number;
maxLength?: number;
+ inputClassName?: string;
+ inputStyle?: string;
password?: boolean;
onChange?: (value: string, e: any) => void;
- onBlur?: (e: any) => void;
- onFocus?: (e: any) => void;
- onConfirm?: (e: any) => void;
+ onBlur?: (value: string, e: any) => void;
+ onFocus?: (value: string, e: any) => void;
+ onConfirm?: (value: string, e: any) => void;
}
export declare const InputBlurDefaultProps: Partial;
diff --git a/src/Input/InputBlur/props.js b/src/Input/InputBlur/props.js
index b33ae711f..a55c41e27 100644
--- a/src/Input/InputBlur/props.js
+++ b/src/Input/InputBlur/props.js
@@ -1,3 +1,3 @@
-export const InputBlurProps = {
-
+export const InputBlurDefaultProps = {
+ enableNative: false,
};
diff --git a/src/Input/Textarea/index.axml b/src/Input/Textarea/index.axml
new file mode 100644
index 000000000..f0d08937b
--- /dev/null
+++ b/src/Input/Textarea/index.axml
@@ -0,0 +1,36 @@
+
+
+
+
+
+
+
+
diff --git a/src/Input/Textarea/index.json b/src/Input/Textarea/index.json
new file mode 100644
index 000000000..3a037cbf8
--- /dev/null
+++ b/src/Input/Textarea/index.json
@@ -0,0 +1,6 @@
+{
+ "component": true,
+ "usingComponents": {
+ "icon": "../../Icon/index"
+ }
+}
diff --git a/src/Input/Textarea/index.less b/src/Input/Textarea/index.less
new file mode 100644
index 000000000..2145f450c
--- /dev/null
+++ b/src/Input/Textarea/index.less
@@ -0,0 +1,56 @@
+@import (reference) "../variable.less";
+
+@inputItemPrefix: ant-textarea;
+.@{inputItemPrefix} {
+ display: flex;
+ align-items: center;
+ background: @COLOR_CARD;
+ &-disabled {
+ opacity: 0.4;
+ }
+ &-line {
+ position: relative;
+ flex: 1;
+ display: flex;
+ align-items: center;
+ overflow: hidden;
+ }
+ &-content {
+ width: 100%;
+ align-self: center;
+ padding: 0;
+ font-size: 34 * @rpx;
+ text-align: left;
+ color: @input-item-color;
+ background: @COLOR_CARD;
+ }
+
+ &-clear {
+ position: absolute;
+ top: 0;
+ right: 0;
+ z-index: 2;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ border-radius: 16 * @rpx;
+ margin-left: 8 * @rpx;
+ &-icon {
+ color: @COLOR_TEXT_WEAK;
+ font-size: 34 * @rpx;
+ }
+ }
+
+ &-clear-show {
+ display: flex;
+ }
+ &-clear-hidden {
+ display: none;
+ pointer-events: none;
+ }
+ &-placeholder {
+ font-size: 34 * @rpx;
+ color: @input-item-placeholder-color;
+ margin-left: -6 * @rpx;
+ }
+}
diff --git a/src/Input/InputBase/index.ts b/src/Input/Textarea/index.ts
similarity index 67%
rename from src/Input/InputBase/index.ts
rename to src/Input/Textarea/index.ts
index 0e53823bb..1d8ac0307 100644
--- a/src/Input/InputBase/index.ts
+++ b/src/Input/Textarea/index.ts
@@ -1,24 +1,13 @@
-import { InputBaseDefaultProps } from './props';
+import { TextareaDefaultProps } from './props';
import fmtEvent from '../../_util/fmtEvent';
import mixinValue from '../../mixins/value';
Component({
- props: InputBaseDefaultProps,
+ props: TextareaDefaultProps,
mixins: [mixinValue()],
- ref() {
- return {
- update: (value) => {
- if (this.isControlled()) {
- console.warn('组件有value props为受控组件,更新使用setData外层的value');
- return;
- }
- this.update(value);
- },
- getValue: () => {
- return this.getValue();
- },
- }
+ data: {
+ selfFocus: false,
},
methods: {
onChange(e) {
@@ -32,12 +21,18 @@ Component({
},
onFocus(e) {
const value = e.detail.value;
+ this.setData({
+ selfFocus: true,
+ });
if (this.props.onFocus) {
this.props.onFocus(value, fmtEvent(this.props, e));
}
},
onBlur(e) {
const value = e.detail.value;
+ this.setData({
+ selfFocus: false,
+ });
if (this.props.onBlur) {
this.props.onBlur(value, fmtEvent(this.props, e));
}
@@ -48,6 +43,14 @@ Component({
this.props.onConfirm(value, fmtEvent(this.props, e));
}
},
+ onClear(e) {
+ if (!this.isControlled()) {
+ this.update('');
+ }
+ if (this.props.onChange) {
+ this.props.onChange('', fmtEvent(this.props, e));
+ }
+ },
}
});
diff --git a/src/Input/Textarea/props.d.ts b/src/Input/Textarea/props.d.ts
new file mode 100644
index 000000000..21153166a
--- /dev/null
+++ b/src/Input/Textarea/props.d.ts
@@ -0,0 +1,24 @@
+import { IBaseProps } from '../../_base';
+/**
+ * @description 输入框。
+ */
+
+export interface TextareaProps extends IBaseProps {
+ value?: string;
+ defaultValue?: string;
+ placeholder?: string;
+ placeholderClassName?: string;
+ placeholderStyle?: string;
+ autoHeight?: boolean;
+ showCount?: boolean;
+ allowClear?: boolean;
+ enableNative?: boolean;
+ maxLength?: number;
+ inputClassName?: string;
+ inputStyle?: string;
+ onChange?: (value: string, e: any) => void;
+ onBlur?: (value: string, e: any) => void;
+ onFocus?: (value: string, e: any) => void;
+ onConfirm?: (value: string, e: any) => void;
+}
+export declare const TextareaDefaultProps: Partial;
diff --git a/src/Input/Textarea/props.js b/src/Input/Textarea/props.js
new file mode 100644
index 000000000..8d8152eda
--- /dev/null
+++ b/src/Input/Textarea/props.js
@@ -0,0 +1,3 @@
+export const TextareaDefaultProps = {
+ enableNative: false,
+};
diff --git a/src/Input/index.axml b/src/Input/index.axml
index ef4e0c11d..af8b2d902 100644
--- a/src/Input/index.axml
+++ b/src/Input/index.axml
@@ -13,9 +13,8 @@
-
+
diff --git a/src/Input/index.less b/src/Input/index.less
index 52aba0eb5..e4de95265 100644
--- a/src/Input/index.less
+++ b/src/Input/index.less
@@ -31,13 +31,6 @@
display: none;
}
}
- &-extra {
- margin-right: 24 * @rpx;
- margin-left: 16 * @rpx;
- &:empty {
- display: none;
- }
- }
&-content {
width: 100%;
align-self: center;
@@ -61,7 +54,7 @@
}
&-clear-show {
- display: block;
+ display: flex;
}
&-clear-hidden {
display: none;
diff --git a/src/Input/index.md b/src/Input/index.md
index 8d7fec05a..f9533a6f2 100644
--- a/src/Input/index.md
+++ b/src/Input/index.md
@@ -16,30 +16,23 @@ toc: 'content'
### Input 基本使用
-### InputBase 基本使用
-InputBase是没有样式的Input
-
-
### SearchBar 搜索框
+### Textarea
+
-## API
-### Input属性
-| 属性 | 说明 | 类型 | 默认值 |
-| -----|-----|-----|-----|
-| allowClear | 可以点击清除图标删除内容 | boolean | false |
-| inputClassName | input类名 | string | - |
-| inputStyle | input样式 | string | - |
+## API
-### Input, InputBase 相同的属性
+### Input, Textarea 相同的属性
| 属性 | 说明 | 类型 | 默认值 |
| -----|-----|-----|-----|
-| defaultValue | 始值值 | boolean | - |
| className | 类名| string | - |
+| defaultValue | 始值值 | boolean | - |
| disabled | 是否禁用 | boolean | false |
-| password | 是否是密码类型 | boolean | false | |
+| enableNative | 光标问题,查看[Input出现光标问题](#input出现光标问题) | boolean | false |
+| maxLength | 最大长度 | number | 140 |
| placeholder | 占位符 | string | - |
| style | 样式| string | - |
| value | 输入框的值。受控模式。 | string | - |
@@ -48,9 +41,23 @@ InputBase是没有样式的Input
| onBlur | 失焦时触发此回调 | (value: string, event: Event) => void | - |
| onChange | 输入时触发此回调 | (value: string, event: Event) => void | - |
-### Input, InputBase 更多相同属性
+### Input属性
+| 属性 | 说明 | 类型 | 默认值 |
+| -----|-----|-----|-----|
+| allowClear | 可以点击清除图标删除内容 | boolean | false |
+| password | 是否是密码类型 | boolean | false |
+
+### Textarea属性
+| 属性 | 说明 | 类型 | 默认值 |
+| -----|-----|-----|-----|
+| autoHeight | 是否自动增高。 | boolean | false |
+| showCount | 是否显示字数统计 | boolean | true |
+
+
+### Input, Textarea 更多相同属性
-以下属性同 https://opendocs.alipay.com/mini/component/input
+https://opendocs.alipay.com/mini/component/input
+https://opendocs.alipay.com/mini/component/textarea
- focus
- enableNative
- always-system
@@ -58,7 +65,7 @@ InputBase是没有样式的Input
- password
- placeholder-style
- placeholder-class
-- maxlength
+- type
- name
- random-number
- selection-start
@@ -67,7 +74,7 @@ InputBase是没有样式的Input
- confirm-type
- confirm-hold
-### Input, InputBase 实例方法
+### Input, Textarea 实例方法
实例方案需要小程序 `component2` 可使用
| 属性 | 说明 | 类型 |
| -----|-----|-----|
diff --git a/src/Input/props.d.ts b/src/Input/props.d.ts
index 88ced34f7..4ccb8dd43 100644
--- a/src/Input/props.d.ts
+++ b/src/Input/props.d.ts
@@ -1,10 +1,29 @@
-import { InputBaseProps } from './InputBase/props';
+import { IBaseProps } from '../_base';
/**
* @description 输入框。
*/
-export interface InputProps extends InputBaseProps {
+export interface InputProps extends IBaseProps {
+ value?: string;
+ defaultValue?: string;
+ placeholder?: string;
+ placeholderClassName?: string;
+ placeholderStyle?: string;
+ allowClear?: boolean;
+ enableNative?: boolean;
+ confirmType?: string;
+ confirmHold?: string;
+ alwaysSystem?: boolean;
+ selectionStart?: number;
+ selectionEnd?: number;
+ cursor?: number;
+ maxLength?: number;
inputClassName?: string;
inputStyle?: string;
+ password?: boolean;
+ onChange?: (value: string, e: any) => void;
+ onBlur?: (value: string, e: any) => void;
+ onFocus?: (value: string, e: any) => void;
+ onConfirm?: (value: string, e: any) => void;
}
export declare const InputDefaultProps: Partial;
diff --git a/src/Input/props.js b/src/Input/props.js
index 3834e04e3..ad26162e1 100644
--- a/src/Input/props.js
+++ b/src/Input/props.js
@@ -1,3 +1,3 @@
export const InputDefaultProps = {
-
+ enableNative: false,
};