mirror of
https://gitee.com/baidu/amis.git
synced 2024-11-29 18:48:45 +08:00
fix: 评分组件 count 支持变量获取 (#5681)
* fix: 评分组件 count 支持变量获取 * tokenize 修改为 filter
This commit is contained in:
parent
a262db9e21
commit
c30b1400d2
@ -9,6 +9,7 @@ import {ClassNamesFn, themeable} from 'amis-core';
|
||||
import {isObject} from 'amis-core';
|
||||
import {validations} from 'amis-core';
|
||||
import {Icon} from './icons';
|
||||
import {isObjectShallowModified} from 'amis-core';
|
||||
|
||||
export type textPositionType = 'left' | 'right';
|
||||
|
||||
@ -96,7 +97,18 @@ export class Rating extends React.Component<RatingProps, any> {
|
||||
componentDidUpdate(prevProps: RatingProps) {
|
||||
const props = this.props;
|
||||
|
||||
if (props.value !== prevProps.value) {
|
||||
if (
|
||||
isObjectShallowModified(
|
||||
{
|
||||
value: props.value,
|
||||
count: props.count
|
||||
},
|
||||
{
|
||||
value: prevProps.value,
|
||||
count: prevProps.count
|
||||
}
|
||||
)
|
||||
) {
|
||||
this.setState(
|
||||
{
|
||||
stars: this.getStars(props.value),
|
||||
@ -110,6 +122,11 @@ export class Rating extends React.Component<RatingProps, any> {
|
||||
this.getShowColorAndText(props.value);
|
||||
}
|
||||
);
|
||||
} else if (
|
||||
isObjectShallowModified(props.colors, prevProps.colors) ||
|
||||
isObjectShallowModified(props.texts, prevProps.texts)
|
||||
) {
|
||||
this.getShowColorAndText(props.value);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -5,7 +5,7 @@ import {
|
||||
FormBaseControl,
|
||||
resolveEventData
|
||||
} from 'amis-core';
|
||||
import {autobind, createObject} from 'amis-core';
|
||||
import {autobind, createObject, filter, toNumber} from 'amis-core';
|
||||
import {ActionObject} from 'amis-core';
|
||||
import {Rating} from 'amis-ui';
|
||||
import type {textPositionType} from 'amis-ui/lib/components/Rating';
|
||||
@ -178,13 +178,17 @@ export default class RatingControl extends React.Component<RatingProps, any> {
|
||||
classnames: cx
|
||||
} = this.props;
|
||||
|
||||
let finalCount: number = getFinalCount(count, this.props.data);
|
||||
// 限制最大 100 星,避免渲染卡死问题
|
||||
finalCount > 100 && (finalCount = 100);
|
||||
|
||||
return (
|
||||
<div className={cx('RatingControl', className)}>
|
||||
<Rating
|
||||
classnames={cx}
|
||||
value={value}
|
||||
disabled={disabled}
|
||||
count={count}
|
||||
count={finalCount}
|
||||
half={half}
|
||||
allowClear={allowClear}
|
||||
readOnly={readOnly}
|
||||
@ -205,8 +209,28 @@ export default class RatingControl extends React.Component<RatingProps, any> {
|
||||
}
|
||||
}
|
||||
|
||||
function getFinalCount(name: number | string, data: any): number {
|
||||
if (typeof name === 'number') {
|
||||
return name;
|
||||
}
|
||||
|
||||
return toNumber(filter(name, data));
|
||||
}
|
||||
|
||||
@FormItem({
|
||||
type: 'input-rating',
|
||||
sizeMutable: false
|
||||
sizeMutable: false,
|
||||
shouldComponentUpdate: (props: any, prevProps: any) =>
|
||||
getFinalCount(props.count, props.data) !==
|
||||
getFinalCount(prevProps.count, prevProps.data),
|
||||
detectProps: [
|
||||
'half',
|
||||
'allowClear',
|
||||
'colors',
|
||||
'inactiveColor',
|
||||
'texts',
|
||||
'textPosition',
|
||||
'char'
|
||||
]
|
||||
})
|
||||
export class RatingControlRenderer extends RatingControl {}
|
||||
|
Loading…
Reference in New Issue
Block a user