mirror of
https://github.com/tusen-ai/naive-ui.git
synced 2025-01-30 12:52:43 +08:00
refactor(rate): clean codes
This commit is contained in:
parent
b062eb122f
commit
56a0a59d2e
@ -1,8 +1,7 @@
|
|||||||
# Color
|
# Color
|
||||||
|
|
||||||
|
That's how disaster happens.
|
||||||
|
|
||||||
```html
|
```html
|
||||||
<n-space>
|
<n-rate color="#4fb233" />
|
||||||
<n-rate />
|
|
||||||
<n-rate color="#4fb233" />
|
|
||||||
</n-space>
|
|
||||||
```
|
```
|
||||||
|
@ -14,12 +14,12 @@ icon
|
|||||||
## Props
|
## Props
|
||||||
|
|
||||||
| 名称 | 类型 | 默认值 | 说明 |
|
| 名称 | 类型 | 默认值 | 说明 |
|
||||||
| --- | --- | --- | --- | --- | --- |
|
| --- | --- | --- | --- |
|
||||||
| count | `number` | `5` | |
|
| count | `number` | `5` | |
|
||||||
| value | `number` | `undefined` | |
|
| value | `number` | `undefined` | |
|
||||||
| default-value | `number` | `0` | |
|
| default-value | `number` | `0` | |
|
||||||
| size | `'small' \| 'medium' \| 'large' \| number` | `'medium'` | |
|
| size | `'small' \| 'medium' \| 'large' \| number` | `'medium'` | |
|
||||||
| on-update:value | `(value: number) => void` | `undefined` | | | |
|
| on-update:value | `(value: number) => void` | `undefined` | |
|
||||||
|
|
||||||
## Slots
|
## Slots
|
||||||
|
|
||||||
|
@ -1,9 +1,7 @@
|
|||||||
# 颜色
|
# 颜色
|
||||||
|
|
||||||
灾难就这么发生了
|
灾难就是这么发生的。
|
||||||
|
|
||||||
```html
|
```html
|
||||||
<n-space align="center">
|
<n-rate color="#4fb233" />
|
||||||
<n-rate />
|
|
||||||
<n-rate color="#4fb233" />
|
|
||||||
</n-space>
|
|
||||||
```
|
```
|
||||||
|
@ -25,10 +25,7 @@ const rateProps = {
|
|||||||
type: Number,
|
type: Number,
|
||||||
default: 5
|
default: 5
|
||||||
},
|
},
|
||||||
value: {
|
value: Number,
|
||||||
type: Number,
|
|
||||||
default: undefined
|
|
||||||
},
|
|
||||||
defaultValue: {
|
defaultValue: {
|
||||||
type: Number,
|
type: Number,
|
||||||
default: 0
|
default: 0
|
||||||
@ -99,13 +96,14 @@ export default defineComponent({
|
|||||||
const { size } = props
|
const { size } = props
|
||||||
const {
|
const {
|
||||||
common: { cubicBezierEaseInOut },
|
common: { cubicBezierEaseInOut },
|
||||||
self: { itemColor, itemColorActive, itemSize }
|
self
|
||||||
} = themeRef.value
|
} = themeRef.value
|
||||||
let mergedSize: string = itemSize
|
const { itemColor, itemColorActive } = self
|
||||||
|
let mergedSize: string
|
||||||
if (typeof size === 'number') {
|
if (typeof size === 'number') {
|
||||||
mergedSize = `${size}px`
|
mergedSize = `${size}px`
|
||||||
} else {
|
} else {
|
||||||
mergedSize = themeRef.value.self[createKey('size', size)]
|
mergedSize = self[createKey('size', size)]
|
||||||
}
|
}
|
||||||
return {
|
return {
|
||||||
'--bezier': cubicBezierEaseInOut,
|
'--bezier': cubicBezierEaseInOut,
|
||||||
|
@ -7,8 +7,7 @@ const self = (vars: ThemeCommonVars) => {
|
|||||||
return {
|
return {
|
||||||
itemColor: railColor,
|
itemColor: railColor,
|
||||||
itemColorActive: '#FFCC33',
|
itemColorActive: '#FFCC33',
|
||||||
itemSize: '20px',
|
sizeSmall: '16px',
|
||||||
sizeSmall: '14px',
|
|
||||||
sizeMedium: '20px',
|
sizeMedium: '20px',
|
||||||
sizeLarge: '24px'
|
sizeLarge: '24px'
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user