feat(input-password): accept global prefixCls (#4280)
* fix(input-password): accept global prefixCls * fix(input-password): suffix icon stylepull/4360/head
parent
5c8b82ccf4
commit
4eb26eaec3
|
@ -5,6 +5,7 @@ import Icon from '../icon';
|
||||||
import inputProps from './inputProps';
|
import inputProps from './inputProps';
|
||||||
import PropTypes from '../_util/vue-types';
|
import PropTypes from '../_util/vue-types';
|
||||||
import BaseMixin from '../_util/BaseMixin';
|
import BaseMixin from '../_util/BaseMixin';
|
||||||
|
import { ConfigConsumerProps } from '../config-provider/configConsumerProps';
|
||||||
|
|
||||||
const ActionMap = {
|
const ActionMap = {
|
||||||
click: 'click',
|
click: 'click',
|
||||||
|
@ -21,11 +22,14 @@ export default {
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
...inputProps,
|
...inputProps,
|
||||||
prefixCls: PropTypes.string.def('ant-input-password'),
|
prefixCls: PropTypes.string,
|
||||||
inputPrefixCls: PropTypes.string.def('ant-input'),
|
inputPrefixCls: PropTypes.string,
|
||||||
action: PropTypes.string.def('click'),
|
action: PropTypes.string.def('click'),
|
||||||
visibilityToggle: PropTypes.bool.def(true),
|
visibilityToggle: PropTypes.bool.def(true),
|
||||||
},
|
},
|
||||||
|
inject: {
|
||||||
|
configProvider: { default: () => ConfigConsumerProps },
|
||||||
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
visible: false,
|
visible: false,
|
||||||
|
@ -46,8 +50,8 @@ export default {
|
||||||
visible: !this.visible,
|
visible: !this.visible,
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
getIcon() {
|
getIcon(prefixCls) {
|
||||||
const { prefixCls, action } = this.$props;
|
const { action } = this.$props;
|
||||||
const iconTrigger = ActionMap[action] || '';
|
const iconTrigger = ActionMap[action] || '';
|
||||||
const iconProps = {
|
const iconProps = {
|
||||||
props: {
|
props: {
|
||||||
|
@ -74,14 +78,19 @@ export default {
|
||||||
},
|
},
|
||||||
render() {
|
render() {
|
||||||
const {
|
const {
|
||||||
prefixCls,
|
prefixCls: customizePrefixCls,
|
||||||
inputPrefixCls,
|
inputPrefixCls: customizeInputPrefixCls,
|
||||||
size,
|
size,
|
||||||
suffix,
|
suffix,
|
||||||
visibilityToggle,
|
visibilityToggle,
|
||||||
...restProps
|
...restProps
|
||||||
} = getOptionProps(this);
|
} = getOptionProps(this);
|
||||||
const suffixIcon = visibilityToggle && this.getIcon();
|
|
||||||
|
const getPrefixCls = this.configProvider.getPrefixCls;
|
||||||
|
const inputPrefixCls = getPrefixCls('input', customizeInputPrefixCls);
|
||||||
|
const prefixCls = getPrefixCls('input-password', customizePrefixCls);
|
||||||
|
|
||||||
|
const suffixIcon = visibilityToggle && this.getIcon(prefixCls);
|
||||||
const inputClassName = classNames(prefixCls, {
|
const inputClassName = classNames(prefixCls, {
|
||||||
[`${prefixCls}-${size}`]: !!size,
|
[`${prefixCls}-${size}`]: !!size,
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in New Issue