mirror of
https://github.com/foomo/foomo-docs.git
synced 2025-10-16 12:35:40 +00:00
fix: localStorage SSR support
This commit is contained in:
parent
e508ddde69
commit
d33307238e
12
foomo/docs/backend/go-by-example/yaml-magic.mdx
Normal file
12
foomo/docs/backend/go-by-example/yaml-magic.mdx
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
import { GoPlayground } from '../../../src/components/GoPlayground';
|
||||||
|
|
||||||
|
# yaml magic
|
||||||
|
|
||||||
|
<GoPlayground
|
||||||
|
id="2J1mp90r6nl"
|
||||||
|
proportion={16/10}
|
||||||
|
/>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -1,8 +1,13 @@
|
|||||||
import React, { useState } from "react";
|
import React, { useEffect, useState } from "react";
|
||||||
|
|
||||||
|
const yes = "yes";
|
||||||
|
const SSR = typeof localStorage === "undefined";
|
||||||
|
|
||||||
if(typeof localStorage == "undefined") {
|
const getISCool = (id) => {
|
||||||
var localStorage = {setItem:(name, value) => {}, getItem: (name) => {return null}};
|
if(typeof localStorage === "undefined") {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
return localStorage.getItem(id);
|
||||||
}
|
}
|
||||||
|
|
||||||
export const IsItCool = (props: {
|
export const IsItCool = (props: {
|
||||||
@ -10,18 +15,17 @@ export const IsItCool = (props: {
|
|||||||
topic: string;
|
topic: string;
|
||||||
id: string;
|
id: string;
|
||||||
}) => {
|
}) => {
|
||||||
let defaultIsCool = false;
|
const [isCool, setIsCool] = useState(getISCool(props.id));
|
||||||
if (localStorage.getItem(props.id) == "yes") {
|
useEffect(() => {
|
||||||
defaultIsCool = true;
|
console.log("well it is cool",props.id, {isCool, SSR})
|
||||||
}
|
}, [isCool, SSR]);
|
||||||
const [isCool, setIsCool] = useState(defaultIsCool);
|
|
||||||
if (!isCool) {
|
if (!isCool) {
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<button
|
<button
|
||||||
className="button button--lg button--secondary"
|
className="button button--lg button--secondary"
|
||||||
onClick={(_e) => {
|
onClick={(_e) => {
|
||||||
localStorage.setItem(props.id, "yes");
|
localStorage.setItem(props.id, yes);
|
||||||
setIsCool(true);
|
setIsCool(true);
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user