Meta Reference

Link

编辑此页面

Link 组件建立页面与外部资源之间的连接。 通常用于链接样式表和其他关联资源。

该组件在文档的 <head> 中渲染一个 link 元素。

import { Link } from "@solidjs/meta";
<Link rel="icon" href="/favicon.ico" />;

使用方法

添加网站图标

要在应用中添加网站图标，可以使用 <Link> 来指向资源：

import { MetaProvider, Link } from "@solidjs/meta";


export default function Root() {
  return (
    <MetaProvider>
      <Link rel="icon" href="/favicon.ico" />
    </MetaProvider>
  );
}

使用表情符号作为网站图标

要使用表情符号作为网站图标，首先创建一个返回包含 SVG 图像的数据 URI 的函数：

const emojiSvg = (emoji) => {
  return (
    `data:image/svg+xml` +
    `<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>${emoji}</text></svg>`
  );
};

然后，在 Link 组件的 href 属性中将表情符号作为参数传入该函数：

import { MetaProvider, Link } from "@solidjs/meta";


export default function Root() {
  return (
    <MetaProvider>
      <Link rel="icon" href={emojiSvg("😎")} />
    </MetaProvider>
  );
}
报告此页面问题