Skip to content

Commit

Permalink
fix: Fix the invalid hot update of BasicButton when changing style ou…
Browse files Browse the repository at this point in the history
…tside (#1016)

* chore: ignore bak dir

Signed-off-by: LiLi <urfreespace@gmail.com>

* fix: 修复BasicButton在外部改变样式热更新无效问题

Signed-off-by: LiLi <urfreespace@gmail.com>

* chore: remove extra ignore

Signed-off-by: LiLi <urfreespace@gmail.com>

* chore: ignore fix

Signed-off-by: LiLi <urfreespace@gmail.com>
  • Loading branch information
urfreespace committed Aug 1, 2021
1 parent 8845156 commit be2d11d
Show file tree
Hide file tree
Showing 2 changed files with 8 additions and 6 deletions.
9 changes: 5 additions & 4 deletions src/components/Button/src/BasicButton.vue
Original file line number Diff line number Diff line change
Expand Up @@ -8,31 +8,32 @@
</Button>
</template>
<script lang="ts">
import { defineComponent, computed } from 'vue';
import { defineComponent, computed, unref } from 'vue';
import { Button } from 'ant-design-vue';
import Icon from '/@/components/Icon/src/Icon.vue';
import { buttonProps } from './props';
import { useAttrs } from '/@/hooks/core/useAttrs';
export default defineComponent({
name: 'AButton',
components: { Button, Icon },
inheritAttrs: false,
props: buttonProps,
setup(props, { attrs }) {
setup(props) {
// get component class
const attrs = useAttrs({ excludeDefaultKeys: false });
const getButtonClass = computed(() => {
const { color, disabled } = props;
return [
{
[`ant-btn-${color}`]: !!color,
[`is-disabled`]: disabled,
},
attrs.class,
];
});
// get inherit binding value
const getBindValue = computed(() => ({ ...attrs, ...props }));
const getBindValue = computed(() => ({ ...unref(attrs), ...props }));
return { getBindValue, getButtonClass };
},
Expand Down
5 changes: 3 additions & 2 deletions src/hooks/core/useAttrs.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import type { Ref } from 'vue';
interface Params {
excludeListeners?: boolean;
excludeKeys?: string[];
excludeDefaultKeys?: boolean;
}

const DEFAULT_EXCLUDE_KEYS = ['class', 'style'];
Expand All @@ -16,9 +17,9 @@ export function useAttrs(params: Params = {}): Ref<Recordable> | {} {
const instance = getCurrentInstance();
if (!instance) return {};

const { excludeListeners = false, excludeKeys = [] } = params;
const { excludeListeners = false, excludeKeys = [], excludeDefaultKeys = true } = params;
const attrs = shallowRef({});
const allExcludeKeys = excludeKeys.concat(DEFAULT_EXCLUDE_KEYS);
const allExcludeKeys = excludeKeys.concat(excludeDefaultKeys ? DEFAULT_EXCLUDE_KEYS : []);

// Since attrs are not reactive, make it reactive instead of doing in `onUpdated` hook for better performance
instance.attrs = reactive(instance.attrs);
Expand Down

0 comments on commit be2d11d

Please sign in to comment.