自定义脚本效果与预期不符

gvenusleo commented 1 year ago

Describe the bug

为了在 Memos 的左侧边栏中加入 RSS 链接，我添加了以下的自定义脚本：

document.getElementById("header-explore").insertAdjacentHTML("afterend", "<a id='header-rss' class='px-4 pr-5 py-2 rounded-full border flex flex-row items-center text-lg text-gray-800 dark:text-gray-300 hover:bg-white hover:border-gray-200 dark:hover:border-zinc-600 dark:hover:bg-zinc-700 border-transparent' href='/u/1/rss.xml'><svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='mr-3 w-6 h-auto opacity-70'><path d='M4 11a9 9 0 0 1 9 9'></path><path d='M4 4a16 16 0 0 1 16 16'></path><circle cx='5' cy='19' r='1'></circle></svg>RSS</a>");

但在我的 Memos 主页，该脚本没有起作用（图 1），与此相反，当我进入 设置 ，每点击一次 系统 ，脚本都会被执行一次，导致左侧边栏出现很多 RSS 链接（图 2）。

Steps to reproduce

使用以下自定义脚本：

document.getElementById("header-explore").insertAdjacentHTML("afterend", "<a id='header-rss' class='px-4 pr-5 py-2 rounded-full border flex flex-row items-center text-lg text-gray-800 dark:text-gray-300 hover:bg-white hover:border-gray-200 dark:hover:border-zinc-600 dark:hover:bg-zinc-700 border-transparent' href='/u/1/rss.xml'><svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='mr-3 w-6 h-auto opacity-70'><path d='M4 11a9 9 0 0 1 9 9'></path><path d='M4 4a16 16 0 0 1 16 16'></path><circle cx='5' cy='19' r='1'></circle></svg>RSS</a>");

保存后刷新。

Screenshots or additional context

不知道是我脚本的问题还是 Memos 的 Bug ？

Issues-translate-bot commented 1 year ago

Issue is not in English. It has been translated automatically.

Title: Custom script effect is not as expected

boojack commented 1 year ago

Fixed with https://github.com/usememos/memos/commit/416e07cb1fbca09700b8f0b05d4515a2dd92e3e8

gvenusleo commented 1 year ago

Thanks for the fix!

gvenusleo commented 1 year ago

Hi, I upgraded my memos to the latest v0.15.0 version, but my custom JavaScript script still hasn't taken effect. This bug seems to have not been fixed yet.

Zeng1998 commented 1 year ago

That may be related to the render mechanism of React.

You can temporarily use setTimeout and wait for a fix, e.g.

setTimeout(()=>{
    document.getElementById("header-explore").insertAdjacentHTML("afterend", "<a id='header-rss' class='px-4 pr-5 py-2 rounded-full border flex flex-row items-center text-lg text-gray-800 dark:text-gray-300 hover:bg-white hover:border-gray-200 dark:hover:border-zinc-600 dark:hover:bg-zinc-700 border-transparent' href='/u/1/rss.xml'><svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='mr-3 w-6 h-auto opacity-70'><path d='M4 11a9 9 0 0 1 9 9'></path><path d='M4 4a16 16 0 0 1 16 16'></path><circle cx='5' cy='19' r='1'></circle></svg>RSS</a>");
},1000);

usememos / memos