From a8e785ffde11d983f2bcda7fa440c1f4d6637be3 Mon Sep 17 00:00:00 2001 From: liufree Date: Sun, 2 Mar 2025 00:56:57 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20app=E8=B0=83=E7=94=A8=EF=BC=8C=E9=9C=80?= =?UTF-8?q?=E8=A6=81=E4=BB=8E=E5=A4=96=E9=9D=A2=E7=A9=BF=E5=8F=82=E6=95=B0?= =?UTF-8?q?app=E5=88=B0react=E7=BB=84=E4=BB=B6=E9=87=8C=E9=9D=A2=E5=8E=BB?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/main.tsx | 2 +- src/pages/ReactDemo.tsx | 7 ++-- src/pages/TableDemo.tsx | 76 ++++++++++++++++++++++++----------------- 3 files changed, 48 insertions(+), 37 deletions(-) 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(); + root.render(); } } 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[] = [ - { - dataIndex: 'index', - valueType: 'indexBorder', - width: 48, - }, - { - title: '标题', - render: (_, record) => ( - - {record.header.path} - - ), - }, - { - title: '文本', - dataIndex: 'text', - filters: true, - onFilter: true, - ellipsis: true, - render: (_, record) => ( - console.log("record",record), - - {record.text} - - ), - }, -]; - -export default () => { +interface MyReactComponentProps { + app: any; // Obsidian的App对象 +} +const MyReactComponent: React.FC = ({ app }) => { const actionRef = useRef(); const dataviewAPI = getAPI(); @@ -83,6 +58,44 @@ export default () => { setData(data); }, []); + const columns: ProColumns[] = [ + { + dataIndex: 'index', + valueType: 'indexBorder', + width: 48, + }, + { + title: '标题', + render: (_, record) => ( + console.log("record",_), + { + // 调用 Obsidian API + const file = app.vault.getAbstractFileByPath(record.header.path); + if (file) { + app.workspace.activeLeaf?.openFile(file); + } + }} > + {record.header.path} + + + ), + }, + { + title: '文本', + dataIndex: 'text', + filters: true, + onFilter: true, + ellipsis: true, + render: (_, record) => ( + console.log("record",record), + + {record.text} + + + ), + }, + ]; + return ( columns={columns} @@ -167,3 +180,4 @@ export default () => { /> ); }; +export default MyReactComponent;