Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

DescItem#render function 'val' parameter type should be any #228

Closed
JohnNiang opened this issue Feb 2, 2021 · 0 comments
Closed

DescItem#render function 'val' parameter type should be any #228

JohnNiang opened this issue Feb 2, 2021 · 0 comments
Labels
bug Something isn't working

Comments

@JohnNiang
Copy link

render 函数声明:

https://github.com/anncwb/vue-vben-admin/blob/85729f0f40db3fd14984d31263dc5bd39306c28e/src/components/Description/src/types.ts#L19

export interface DescItem {
  labelMinWidth?: number;

  contentMinWidth?: number;

  labelStyle?: CSSProperties;

  field: string;
  label: string | VNode | JSX.Element;
  // Merge column
  span?: number;
  show?: (...arg: any) => boolean;
  // render
  render?: (
    val: string,
    data: Recordable
  ) => VNode | undefined | JSX.Element | Element | string | number;
}

真实使用 render 函数的地方:

https://github.com/anncwb/vue-vben-admin/blob/85729f0f40db3fd14984d31263dc5bd39306c28e/src/components/Description/src/index.tsx#L95

    function renderItem() {
      const { schema } = unref(getProps);
      return unref(schema).map((item) => {
        const { render, field, span, show, contentMinWidth } = item;
        const { data } = unref(getProps) as DescOptions;

        if (show && isFunction(show) && !show(data)) {
          return null;
        }

        const getContent = () =>
          isFunction(render) ? render(data?.[field], data) : unref(data) && unref(data)[field];

        const width = contentMinWidth;
        return (
          <Descriptions.Item label={renderLabel(item)} key={field} span={span}>
            {() => {
              if (!contentMinWidth) {
                return getContent();
              }
              const style: CSSProperties = {
                minWidth: `${width}px`,
              };
              return <div style={style}>{getContent()}</div>;
            }}
          </Descriptions.Item>
        );
      });
    }

render 函数的第二个参数类型为 Recorable(declare type Recordable<T extends any = any> = Record<string, T>),且 val 的值来源于 data?.[field]unref(data)[field],所以 val 的类型应该是 any,而不应该是 string。

@anncwb anncwb added the bug Something isn't working label Feb 3, 2021
anncwb added a commit that referenced this issue Feb 3, 2021
@anncwb anncwb closed this as completed Feb 3, 2021
anncwb added a commit that referenced this issue Feb 4, 2021
@github-actions github-actions bot locked and limited conversation to collaborators Sep 29, 2024
# for free to subscribe to this conversation on GitHub. Already have an account? #.
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants