-
Notifications
You must be signed in to change notification settings - Fork 1.6k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
标记(badge)不能遮盖住「按钮聚焦时高亮的边框」 #5929
Labels
untriaged
need to sort
Comments
将结构改成这样就行了。 <script setup lang="ts">
import { NButton } from 'naive-ui'
import { defineModel } from 'vue'
import { NBadge } from 'naive-ui'
const buttonType = defineModel<'default' | 'primary'>('state', { default: 'default' })
function toggleButtonType() {
buttonType.value = buttonType.value === 'default' ? 'primary' : 'default'
}
const remaining = defineModel<number>('remaining', { default: 9 })
</script>
<template>
<n-badge :value="remaining" type="info">
<n-button :focusable="false" :type="buttonType" @click="toggleButtonType"></n-button>
<template #value>
<slot></slot>
</template>
</n-badge>
</template>
<style scoped>
.n-button {
width: 60px;
height: 60px;
padding: 0;
}
</style>
|
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
描述错误
如图,鼠标悬浮在按钮上时,标记无法盖住边框线
复现步骤
呃就 鼠标移上去?
最小复现链接
https://gist.github.com/yd278/018ba71096bd2faf4bb39b1866e16cb7
系统信息
使用的包管理器
npm
验证
The text was updated successfully, but these errors were encountered: