diff --git a/packages/app/src/components/views/Field/index.tsx b/packages/app/src/components/views/Field/index.tsx
index f5fa620c9d..96b719a695 100644
--- a/packages/app/src/components/views/Field/index.tsx
+++ b/packages/app/src/components/views/Field/index.tsx
@@ -3,6 +3,7 @@ import React, { useEffect, useState } from 'react';
 import moment from 'moment';
 import { Tag } from 'antd';
 import Icon from '@/components/icons';
+import get from 'lodash/get';
 
 const InterfaceTypes = new Map<string, any>();
 
@@ -111,6 +112,18 @@ export function DataSourceField(props: any) {
   )
 }
 
+export function RealtionField(props: any) {
+  const { schema: { labelField }, value } = props;
+  if (!value) {
+    return;
+  }
+  console.log(labelField, value);
+  const items = Array.isArray(value) ? value : [value];
+  return items.map(item => (
+    <span>{get(item, labelField)}</span>
+  ));
+}
+
 registerFieldComponents({
   string: StringField,
   textarea: TextareaField,
@@ -125,6 +138,8 @@ registerFieldComponents({
   createdAt: DateTimeField,
   updatedAt: DateTimeField,
   icon: IconField,
+  createdBy: RealtionField,
+  updatedBy: RealtionField,
 });
 
 export default function Field(props: any) {