djledda.de main
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

2 月之前
2 月之前
2 月之前
2 月之前
2 月之前
2 月之前
2 月之前
2 月之前
2 月之前
2 月之前
2 月之前
2 月之前
12345678910111213141516171819202122232425262728293031323334353637
  1. import { watch, toValue, type MaybeRefOrGetter } from 'vue';
  2. import useDJSSRContext from "@/useDJSSRContext.ts";
  3. import { h } from "@/util.ts";
  4. export default function useHead(params: {
  5. title: MaybeRefOrGetter<string>,
  6. metatags?: MaybeRefOrGetter<Array<{ name: string, content: string }>>
  7. }) {
  8. const context = useDJSSRContext();
  9. if (context) {
  10. context.head.title = params.title;
  11. context.head.metatags = params.metatags ?? [];
  12. } else {
  13. watch([() => toValue(params.title), () => toValue(params.metatags) ?? []], ([newTitle, newMetatags]) => {
  14. if (newTitle) {
  15. document.title = newTitle;
  16. }
  17. const currMetatags = document.head.querySelectorAll('meta');
  18. const existing = new Set<string>();
  19. for (const currMetatag of currMetatags) {
  20. const match = newMetatags.find(_ => _.name === currMetatag.name);
  21. if (!match) {
  22. currMetatag.remove();
  23. } else {
  24. existing.add(match.name);
  25. currMetatag.content = match.content;
  26. }
  27. }
  28. for (const newMetatag of newMetatags) {
  29. if (!existing.has(newMetatag.name)) {
  30. document.head.appendChild(h('meta', newMetatag));
  31. }
  32. }
  33. }, { immediate: true });
  34. }
  35. }