github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat(input-password): accept global prefixCls (#4430)

pull/4459/head
zkwolf 2021-07-30 16:10:58 +08:00 committed by GitHub
parent 903ac35aa7
commit 5409ce545c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 15 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
components/input/Password.tsx
View File

@ -7,7 +7,8 @@ import EyeInvisibleOutlined from '@ant-design/icons-vue/EyeInvisibleOutlined';
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 { defineComponent } from 'vue'; import { defineComponent, inject } from 'vue';
import { defaultConfigProvider } from '../config-provider';
const ActionMap = { const ActionMap = {
click: 'onClick', click: 'onClick',
@ -20,8 +21,8 @@ export default defineComponent({
inheritAttrs: false, inheritAttrs: false,
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.looseBool.def(true), visibilityToggle: PropTypes.looseBool.def(true),
iconRender: PropTypes.func.def((visible: boolean) => iconRender: PropTypes.func.def((visible: boolean) =>
@ -31,6 +32,7 @@ export default defineComponent({
setup() { setup() {
return { return {
input: null, input: null,
configProvider: inject('configProvider', defaultConfigProvider),
}; };
}, },
data() { data() {
@ -56,8 +58,8 @@ export default defineComponent({
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 iconRender = this.$slots.iconRender || this.$props.iconRender; const iconRender = this.$slots.iconRender || this.$props.iconRender;
const icon = iconRender(this.visible); const icon = iconRender(this.visible);
@ -81,8 +83,8 @@ export default defineComponent({
}, },
render() { render() {
const { const {
prefixCls, prefixCls: customizePrefixCls,
inputPrefixCls, inputPrefixCls: customizeInputPrefixCls,
size, size,
suffix, suffix,
action, action,
@ -91,7 +93,12 @@ export default defineComponent({
...restProps ...restProps
} = getOptionProps(this); } = getOptionProps(this);
const { class: className } = this.$attrs; const { class: className } = this.$attrs;
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, className, { const inputClassName = classNames(prefixCls, className, {
[`${prefixCls}-${size}`]: !!size, [`${prefixCls}-${size}`]: !!size,
}); });