diff --git a/src/main.tsx b/src/main.tsx
index b0cde97..807e8d2 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -96,7 +96,7 @@ export default class MyPlugin extends Plugin {
 			const container = el.createDiv();
 
 			// 创建一个 MarkdownRenderChild 实例
-			const reactComponent = new ReactDemo(container, source);
+			const reactComponent = new ReactDemo(container, source,this.app);
 			ctx.addChild(reactComponent);
 
 		});
diff --git a/src/pages/ReactDemo.tsx b/src/pages/ReactDemo.tsx
index 91ac185..d845613 100644
--- a/src/pages/ReactDemo.tsx
+++ b/src/pages/ReactDemo.tsx
@@ -10,10 +10,7 @@ export  default class ReactComponent extends MarkdownRenderChild {
 	root: Root;
 	container: HTMLElement;
 
-
-
-
-	constructor(container: HTMLElement, private source: string) {
+	constructor(container: HTMLElement, private source: string, private app: App) {
         super(container);
 		this.container = container;
 	}
@@ -28,6 +25,6 @@ export  default class ReactComponent extends MarkdownRenderChild {
 
 		// 使用 createRoot 渲染 React 组件
 		const root = createRoot(this.container);
-		root.render(<TableDemo  />);
+		root.render(<TableDemo app={this.app}   />);
 	}
 }
diff --git a/src/pages/TableDemo.tsx b/src/pages/TableDemo.tsx
index 03f556b..789c02d 100644
--- a/src/pages/TableDemo.tsx
+++ b/src/pages/TableDemo.tsx
@@ -5,7 +5,8 @@ import {Button, Dropdown, Space, Tag} from 'antd';
 import {useEffect, useRef} from 'react';
 import React from 'react';
 import request from 'umi-request';
-import { getAPI } from 'obsidian-dataview';
+import {getAPI} from 'obsidian-dataview';
+import {App,Workspace} from "obsidian";
 
 export const waitTimePromise = async (time: number = 100) => {
 	return new Promise((resolve) => {
@@ -39,37 +40,11 @@ type GithubIssueItem = {
 	text: string;
 };
 
-const columns: ProColumns<GithubIssueItem>[] = [
-	{
-		dataIndex: 'index',
-		valueType: 'indexBorder',
-		width: 48,
-	},
-	{
-		title: '标题',
-		render: (_, record) => (
-			<Space>
-				{record.header.path}
-			</Space>
-		),
-	},
-	{
-		title: '文本',
-		dataIndex: 'text',
-		filters: true,
-		onFilter: true,
-		ellipsis: true,
-		render: (_, record) => (
-			console.log("record",record),
-			<Space>
-				{record.text}
-			</Space>
 
-		),
-	},
-];
-
-export default () => {
+interface MyReactComponentProps {
+	app: any; // Obsidian的App对象
+}
+const MyReactComponent: React.FC<MyReactComponentProps> = ({ app }) => {
 	const actionRef = useRef<ActionType>();
 
 	const dataviewAPI = getAPI();
@@ -83,6 +58,44 @@ export default () => {
 		setData(data);
 	}, []);
 
+	const columns: ProColumns<GithubIssueItem>[] = [
+		{
+			dataIndex: 'index',
+			valueType: 'indexBorder',
+			width: 48,
+		},
+		{
+			title: '标题',
+			render: (_, record) => (
+				console.log("record",_),
+					<a onClick={()=>{
+						// 调用 Obsidian API
+						const file = app.vault.getAbstractFileByPath(record.header.path);
+						if (file) {
+							app.workspace.activeLeaf?.openFile(file);
+						}
+					}} >
+						{record.header.path}
+					</a>
+
+			),
+		},
+		{
+			title: '文本',
+			dataIndex: 'text',
+			filters: true,
+			onFilter: true,
+			ellipsis: true,
+			render: (_, record) => (
+				console.log("record",record),
+					<Space>
+						{record.text}
+					</Space>
+
+			),
+		},
+	];
+
 	return (
 		<ProTable<GithubIssueItem>
 			columns={columns}
@@ -167,3 +180,4 @@ export default () => {
 		/>
 	);
 };
+export default MyReactComponent;