diff --git a/.vscode/settings.json b/.vscode/settings.json
index 9d0d5cb..569b806 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -10,7 +10,8 @@
     "Immer",
     "Popconfirm",
     "shenzhen",
-    "stylelint"
+    "stylelint",
+    "testid"
   ],
   "stylelint.validate": ["css", "less", "postcss", "scss"],
   "editor.formatOnSave": true
diff --git a/test/core-react/@helpers/renderers.tsx b/test/core-react/@helpers/renderers.tsx
index 6f18fe8..ebba1ad 100644
--- a/test/core-react/@helpers/renderers.tsx
+++ b/test/core-react/@helpers/renderers.tsx
@@ -1,26 +1,52 @@
-import type { IRenderers, ISchema } from '@core-react/index'
+import type { IObjectSchema, IRenderers, ISchema } from '@core-react/index'
+import { RendererIterator } from '@core-react/index'
 import classNames from 'classnames'
 
 const renderers: IRenderers<any, ISchema> = {
+  Object: {
+    formItem: ({ schema, path, objectStyle }) => {
+      return (
+        <div {...schema.renderOptions}>
+          <div>{schema.title}</div>
+          <div style={objectStyle}>
+            <RendererIterator schema={schema as IObjectSchema} path={path} />
+          </div>
+        </div>
+      )
+    },
+  },
   InputText: {
-    component: ({ schema, value, disabled, readonly, onChange }) => {
-      if (readonly) {
-        return <div className="input-text is-readonly">{value}</div>
-      }
+    component: ({ schema, value, onChange }) => {
       return (
         <input
-          className={classNames('input-text', { 'is-disabled': disabled })}
+          className="input-text"
           {...schema.renderOptions}
           value={value ?? ''}
           onChange={(e) => onChange(e.target.value)}
         />
       )
     },
+    readonlyComponent: ({ schema, value }) => (
+      <div {...schema.renderOptions} className="input-text is-readonly">
+        {value}
+      </div>
+    ),
+    disabledComponent: ({ schema, value }) => (
+      <input
+        {...schema.renderOptions}
+        className="input-text is-disabled"
+        value={value ?? ''}
+      />
+    ),
   },
   InputNumber: {
     component: ({ schema, value, disabled, readonly, onChange }) => {
       if (readonly) {
-        return <div className="input-number is-readonly">{value}</div>
+        return (
+          <div {...schema.renderOptions} className="input-number is-readonly">
+            {value}
+          </div>
+        )
       }
       return (
         <input
@@ -35,7 +61,11 @@ const renderers: IRenderers<any, ISchema> = {
   TextArea: {
     component: ({ schema, value, disabled, readonly, onChange }) => {
       if (readonly) {
-        return <div className="textarea is-readonly">{value}</div>
+        return (
+          <div {...schema.renderOptions} className="textarea is-readonly">
+            {value}
+          </div>
+        )
       }
       return (
         <textarea
@@ -49,11 +79,8 @@ const renderers: IRenderers<any, ISchema> = {
     },
   },
   // 输出警告的 InputText 渲染器
-  WarningInputText: {
-    component: ({ schema, value, disabled, readonly, onChange }) => {
-      if (readonly) {
-        return <div className="input-text is-readonly">{value}</div>
-      }
+  InputTextWithWarning: {
+    component: ({ schema, value, disabled, onChange }) => {
       return (
         <input
           className={classNames('input-text', { 'is-disabled': disabled })}
@@ -63,13 +90,62 @@ const renderers: IRenderers<any, ISchema> = {
         />
       )
     },
+    readonlyComponent: ({ schema, value }) => (
+      <div {...schema.renderOptions} className="input-text is-readonly">
+        {value}
+      </div>
+    ),
     validator: () => {
       return {
         status: 'warning',
-        message: 'warning-message-from-WarningInputText',
+        message: 'warning-message-from-InputTextWithWarning',
       }
     },
   },
+  // onChange 带 extra 信息的 InputText 渲染器
+  InputTextWithChangeExtra: {
+    component: ({ schema, value, disabled, onChange }) => {
+      return (
+        <input
+          className={classNames('input-text', { 'is-disabled': disabled })}
+          {...schema.renderOptions}
+          value={value ?? ''}
+          onChange={(e) =>
+            onChange(e.target.value, {
+              extra: '我是额外的数据',
+            })
+          }
+        />
+      )
+    },
+    readonlyComponent: ({ schema, value }) => (
+      <div {...schema.renderOptions} className="input-text is-readonly">
+        {value}
+      </div>
+    ),
+  },
+  // onChange 不触发「校验器」的 InputText 渲染器
+  InputTextWithoutTriggerValidator: {
+    component: ({ schema, value, disabled, onChange }) => {
+      return (
+        <input
+          className={classNames('input-text', { 'is-disabled': disabled })}
+          {...schema.renderOptions}
+          value={value ?? ''}
+          onChange={(e) =>
+            onChange(e.target.value, {
+              triggerValidator: false,
+            })
+          }
+        />
+      )
+    },
+    readonlyComponent: ({ schema, value }) => (
+      <div {...schema.renderOptions} className="input-text is-readonly">
+        {value}
+      </div>
+    ),
+  },
 }
 
 export default renderers
diff --git a/test/core-react/disabled.test.tsx b/test/core-react/disabled.test.tsx
new file mode 100644
index 0000000..0afb55c
--- /dev/null
+++ b/test/core-react/disabled.test.tsx
@@ -0,0 +1,53 @@
+import { wrapRootSchema } from '@test/@helpers/schema'
+import { render, screen } from '@testing-library/react'
+
+import CompletedCore from './@helpers/CompletedCore'
+
+const schema = wrapRootSchema({
+  width: {
+    title: '宽度',
+    renderType: 'InputNumber',
+    renderOptions: {
+      'data-testid': 'tid-width',
+    },
+    disabled: true,
+  },
+  height: {
+    title: '高度',
+    renderType: 'InputNumber',
+    renderOptions: {
+      'data-testid': 'tid-height',
+    },
+  },
+  nested: {
+    title: 'object-title',
+    renderType: 'Object',
+    properties: {
+      left: {
+        title: '水平位置',
+        renderType: 'InputNumber',
+        renderOptions: {
+          'data-testid': 'tid-left',
+        },
+      },
+    },
+  },
+})
+
+describe('disabled 验证', () => {
+  test('局部只读态，应该只影响自身', async () => {
+    render(<CompletedCore schema={schema} />)
+    const elem = screen.queryByTestId('tid-width')
+    expect(elem).toBeInTheDocument()
+    expect(elem?.classList.contains('is-disabled')).toBeTruthy()
+  })
+
+  test('全局只读态，应该影响所有的表单项', async () => {
+    render(<CompletedCore schema={schema} disabled />)
+    const formItems = ['width', 'height', 'left']
+    formItems.forEach((name) => {
+      const elem = screen.queryByTestId(`tid-${name}`)
+      expect(elem?.classList.contains('is-disabled')).toBeTruthy()
+    })
+  })
+})
diff --git a/test/core-react/onChange.test.tsx b/test/core-react/onChange.test.tsx
new file mode 100644
index 0000000..cdddcc6
--- /dev/null
+++ b/test/core-react/onChange.test.tsx
@@ -0,0 +1,118 @@
+import { wrapRootSchema } from '@test/@helpers/schema'
+import { fireEvent, render, screen } from '@testing-library/react'
+
+import CompletedCore from './@helpers/CompletedCore'
+
+const schema = wrapRootSchema({
+  width: {
+    title: '宽度',
+    renderType: 'InputNumber',
+    renderOptions: {
+      'data-testid': 'tid-width',
+    },
+    required: true,
+  },
+  height: {
+    title: '高度',
+    renderType: 'InputNumber',
+    renderOptions: {
+      'data-testid': 'tid-height',
+    },
+  },
+  remark: {
+    title: '备注',
+    renderType: 'InputTextWithWarning',
+    renderOptions: {
+      'data-testid': 'tid-remark',
+    },
+  },
+  extra: {
+    title: '携带额外信息',
+    renderType: 'InputTextWithChangeExtra',
+    renderOptions: {
+      'data-testid': 'tid-extra',
+    },
+  },
+  withoutValidator: {
+    title: '不要触发校验器',
+    renderType: 'InputTextWithoutTriggerValidator',
+    renderOptions: {
+      'data-testid': 'tid-without-validator',
+    },
+  },
+  nested: {
+    title: 'object-title',
+    renderType: 'Object',
+    properties: {
+      left: {
+        title: '水平位置',
+        renderType: 'InputNumber',
+        renderOptions: {
+          'data-testid': 'tid-left',
+        },
+      },
+    },
+  },
+})
+
+describe('onChange 验证', () => {
+  test('input 输入内容后，onChange 回调值应该一致', async () => {
+    const onChange = jest.fn()
+    render(<CompletedCore schema={schema} onChange={onChange} />)
+
+    const inputElem = screen.queryByTestId('tid-width')
+    expect(inputElem).toBeInTheDocument()
+
+    fireEvent.change(inputElem!, { target: { value: '800' } })
+    expect(onChange).toBeCalledWith(
+      { width: 800 },
+      { path: ['width'], sPath: 'width', value: 800 }
+    )
+  })
+
+  test('对象嵌套的 input 输入内容后，onChange 回调值应该一致', async () => {
+    const onChange = jest.fn()
+    render(<CompletedCore schema={schema} onChange={onChange} />)
+
+    const inputElem = screen.queryByTestId('tid-left')
+    expect(inputElem).toBeInTheDocument()
+
+    fireEvent.change(inputElem!, { target: { value: '800' } })
+    expect(onChange).toBeCalledWith(
+      { nested: { left: 800 } },
+      { path: ['nested', 'left'], sPath: 'nested.left', value: 800 }
+    )
+  })
+
+  test('渲染器 onChange 带 extra 属性，Core onChange 回调值应该存在 extra 且数据一致', async () => {
+    const onChange = jest.fn()
+    render(<CompletedCore schema={schema} onChange={onChange} />)
+
+    const inputElem = screen.queryByTestId('tid-extra')
+    expect(inputElem).toBeInTheDocument()
+
+    const inputContent = '我是输入的内容'
+    fireEvent.change(inputElem!, { target: { value: inputContent } })
+    expect(onChange).toBeCalledWith(
+      { extra: inputContent },
+      { path: ['extra'], sPath: 'extra', value: inputContent, extra: '我是额外的数据' }
+    )
+  })
+
+  test('渲染器 onChange 的 triggerValidator 为 false，则不触发此次校验器', async () => {
+    const onChange = jest.fn()
+    render(<CompletedCore schema={schema} onChange={onChange} />)
+
+    const inputElem = screen.queryByTestId('tid-without-validator')
+    expect(inputElem).toBeInTheDocument()
+
+    const inputContent = '我是输入的内容'
+    fireEvent.change(inputElem!, { target: { value: inputContent } })
+    expect(onChange).toBeCalledWith(
+      { withoutValidator: inputContent },
+      { path: ['withoutValidator'], sPath: 'withoutValidator', value: inputContent }
+    )
+
+    // 校验状态无法验证，因为组件不会被重新渲染
+  })
+})
diff --git a/test/core-react/onItemChange.test.tsx b/test/core-react/onItemChange.test.tsx
new file mode 100644
index 0000000..b7e896d
--- /dev/null
+++ b/test/core-react/onItemChange.test.tsx
@@ -0,0 +1,119 @@
+import { wrapRootSchema } from '@test/@helpers/schema'
+import { fireEvent, render, screen } from '@testing-library/react'
+
+import CompletedCore from './@helpers/CompletedCore'
+
+const schema = wrapRootSchema({
+  width: {
+    title: '宽度',
+    renderType: 'InputNumber',
+    renderOptions: {
+      'data-testid': 'tid-width',
+    },
+    required: true,
+  },
+  height: {
+    title: '高度',
+    renderType: 'InputNumber',
+    renderOptions: {
+      'data-testid': 'tid-height',
+    },
+  },
+  remark: {
+    title: '备注',
+    renderType: 'InputTextWithWarning',
+    renderOptions: {
+      'data-testid': 'tid-remark',
+    },
+  },
+  extra: {
+    title: '携带额外信息',
+    renderType: 'InputTextWithChangeExtra',
+    renderOptions: {
+      'data-testid': 'tid-extra',
+    },
+  },
+  withoutValidator: {
+    title: '不要触发校验器',
+    renderType: 'InputTextWithoutTriggerValidator',
+    renderOptions: {
+      'data-testid': 'tid-without-validator',
+    },
+  },
+  nested: {
+    title: 'object-title',
+    renderType: 'Object',
+    properties: {
+      left: {
+        title: '水平位置',
+        renderType: 'InputNumber',
+        renderOptions: {
+          'data-testid': 'tid-left',
+        },
+      },
+    },
+  },
+})
+
+describe('onItemChange 验证', () => {
+  test('input 输入内容后，onItemChange 回调值应该一致', async () => {
+    const onItemChange = jest.fn()
+    render(<CompletedCore schema={schema} onItemChange={onItemChange} />)
+
+    const inputElem = screen.queryByTestId('tid-width')
+    expect(inputElem).toBeInTheDocument()
+
+    fireEvent.change(inputElem!, { target: { value: '800' } })
+    expect(onItemChange).toBeCalledWith({ path: ['width'], sPath: 'width', value: 800 })
+  })
+
+  test('对象嵌套的 input 输入内容后，onItemChange 回调值应该一致', async () => {
+    const onItemChange = jest.fn()
+    render(<CompletedCore schema={schema} onItemChange={onItemChange} />)
+
+    const inputElem = screen.queryByTestId('tid-left')
+    expect(inputElem).toBeInTheDocument()
+
+    fireEvent.change(inputElem!, { target: { value: '800' } })
+    expect(onItemChange).toBeCalledWith({
+      path: ['nested', 'left'],
+      sPath: 'nested.left',
+      value: 800,
+    })
+  })
+
+  test('渲染器 onItemChange 带 extra 属性，Core onItemChange 回调值应该存在 extra 且数据一致', async () => {
+    const onItemChange = jest.fn()
+    render(<CompletedCore schema={schema} onItemChange={onItemChange} />)
+
+    const inputElem = screen.queryByTestId('tid-extra')
+    expect(inputElem).toBeInTheDocument()
+
+    const inputContent = '我是输入的内容'
+    fireEvent.change(inputElem!, { target: { value: inputContent } })
+    expect(onItemChange).toBeCalledWith({
+      path: ['extra'],
+      sPath: 'extra',
+      value: inputContent,
+      extra: '我是额外的数据',
+    })
+  })
+
+  test('渲染器 onItemChange 的 triggerValidator 为 false，则不触发此次校验器', async () => {
+    const onItemChange = jest.fn()
+    render(<CompletedCore schema={schema} onItemChange={onItemChange} />)
+
+    const inputElem = screen.queryByTestId('tid-without-validator')
+    expect(inputElem).toBeInTheDocument()
+
+    const inputContent = '我是输入的内容'
+    fireEvent.change(inputElem!, { target: { value: inputContent } })
+    expect(onItemChange).toBeCalledWith({
+      path: ['withoutValidator'],
+      sPath: 'withoutValidator',
+      value: inputContent,
+    })
+
+    // 校验状态无法验证，因为组件不会被重新渲染
+  })
+})
diff --git a/test/core-react/openApi.test.tsx b/test/core-react/openApi.test.tsx
index 93e7b0d..54f65a1 100644
--- a/test/core-react/openApi.test.tsx
+++ b/test/core-react/openApi.test.tsx
@@ -19,7 +19,7 @@ const schema = wrapRootSchema({
   },
   remark: {
     title: '备注',
-    renderType: 'WarningInputText',
+    renderType: 'InputTextWithWarning',
     className: 'cls-remark',
   },
 })
@@ -47,7 +47,7 @@ describe('validate 验证', () => {
         path: ['remark'],
         value: undefined,
         status: 'warning',
-        message: 'warning-message-from-WarningInputText',
+        message: 'warning-message-from-InputTextWithWarning',
         extra: undefined,
       },
     ])
diff --git a/test/core-react/readonly.test.tsx b/test/core-react/readonly.test.tsx
new file mode 100644
index 0000000..9e1e9c2
--- /dev/null
+++ b/test/core-react/readonly.test.tsx
@@ -0,0 +1,53 @@
+import { wrapRootSchema } from '@test/@helpers/schema'
+import { render, screen } from '@testing-library/react'
+
+import CompletedCore from './@helpers/CompletedCore'
+
+const schema = wrapRootSchema({
+  width: {
+    title: '宽度',
+    renderType: 'InputNumber',
+    renderOptions: {
+      'data-testid': 'tid-width',
+    },
+    readonly: true,
+  },
+  height: {
+    title: '高度',
+    renderType: 'InputNumber',
+    renderOptions: {
+      'data-testid': 'tid-height',
+    },
+  },
+  nested: {
+    title: 'object-title',
+    renderType: 'Object',
+    properties: {
+      left: {
+        title: '水平位置',
+        renderType: 'InputNumber',
+        renderOptions: {
+          'data-testid': 'tid-left',
+        },
+      },
+    },
+  },
+})
+
+describe('readonly 验证', () => {
+  test('局部只读态，应该只影响自身', async () => {
+    render(<CompletedCore schema={schema} />)
+    const elem = screen.queryByTestId('tid-width')
+    expect(elem).toBeInTheDocument()
+    expect(elem?.classList.contains('is-readonly')).toBeTruthy()
+  })
+
+  test('全局只读态，应该影响所有的表单项', async () => {
+    render(<CompletedCore schema={schema} readonly />)
+    const formItems = ['width', 'height', 'left']
+    formItems.forEach((name) => {
+      const elem = screen.queryByTestId(`tid-${name}`)
+      expect(elem?.classList.contains('is-readonly')).toBeTruthy()
+    })
+  })
+})
diff --git a/test/core-react/watch.test.tsx b/test/core-react/watch.test.tsx
new file mode 100644
index 0000000..0477536
--- /dev/null
+++ b/test/core-react/watch.test.tsx
@@ -0,0 +1,100 @@
+import { wrapRootSchema } from '@test/@helpers/schema'
+import { fireEvent, render, screen } from '@testing-library/react'
+
+import CompletedCore from './@helpers/CompletedCore'
+
+const schema = wrapRootSchema({
+  width: {
+    title: '宽度',
+    renderType: 'InputNumber',
+    renderOptions: {
+      'data-testid': 'tid-width',
+    },
+    required: true,
+  },
+  height: {
+    title: '高度',
+    renderType: 'InputNumber',
+    renderOptions: {
+      'data-testid': 'tid-height',
+    },
+  },
+  remark: {
+    title: '备注',
+    renderType: 'InputTextWithWarning',
+    renderOptions: {
+      'data-testid': 'tid-remark',
+    },
+  },
+  extra: {
+    title: '携带额外信息',
+    renderType: 'InputTextWithChangeExtra',
+    renderOptions: {
+      'data-testid': 'tid-extra',
+    },
+  },
+  withoutValidator: {
+    title: '不要触发校验器',
+    renderType: 'InputTextWithoutTriggerValidator',
+    renderOptions: {
+      'data-testid': 'tid-without-validator',
+    },
+  },
+  nested: {
+    title: 'object-title',
+    renderType: 'Object',
+    properties: {
+      left: {
+        title: '水平位置',
+        renderType: 'InputNumber',
+        renderOptions: {
+          'data-testid': 'tid-left',
+        },
+      },
+    },
+  },
+})
+
+describe('watch 验证', () => {
+  test('表单项输入内容后，监听函数回调值应该正确', async () => {
+    const onWidthChange = jest.fn()
+    render(
+      <CompletedCore
+        schema={schema}
+        watch={{
+          width: onWidthChange,
+        }}
+      />
+    )
+
+    const inputElem = screen.queryByTestId('tid-width')
+    expect(inputElem).toBeInTheDocument()
+
+    fireEvent.change(inputElem!, { target: { value: '800' } })
+    expect(onWidthChange).toBeCalledWith(
+      { width: 800 },
+      { path: ['width'], sPath: 'width', value: 800 }
+    )
+  })
+
+  test('对象嵌套的表单项输入内容后，监听函数回调值应该正确', async () => {
+    const onLeftChange = jest.fn()
+    render(
+      <CompletedCore
+        schema={schema}
+        watch={{
+          'nested.left': onLeftChange,
+        }}
+      />
+    )
+
+    const inputElem = screen.queryByTestId('tid-left')
+    expect(inputElem).toBeInTheDocument()
+
+    fireEvent.change(inputElem!, { target: { value: '800' } })
+    expect(onLeftChange).toBeCalledWith(
+      { nested: { left: 800 } },
+      { path: ['nested', 'left'], sPath: 'nested.left', value: 800 }
+    )
+  })
+})