fix: 评分组件 count 支持变量获取 (#5681)

* fix: 评分组件 count 支持变量获取

* tokenize 修改为 filter
This commit is contained in:
sansiro 2022-11-08 10:35:36 +08:00 committed by GitHub
parent a262db9e21
commit c30b1400d2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 45 additions and 4 deletions

View File

@ -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);
}
}

View File

@ -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 {}