qwik icon indicating copy to clipboard operation
qwik copied to clipboard

How to prevent texts hydration?

Open polRk opened this issue 3 years ago • 0 comments

Is your feature request related to a problem?

I have a proxy, that translate all texts in output (from ssr server) html.

client (browser) -> proxy (translate output) -> ssr qwik server.

I wana to prevent hydrate translated texts (After state changes for example). How can I do this?

Example:
import { component$, useStore } from '@builder.io/qwik';

export const App = component$(() => {
  const store = useStore({ count: 0 });

  return (
    <div>
      <p>Count: {store.count}</p>
      <p>
        <button onClick$={() => store.count++}>Click</button>
      </p>
    </div>
  );
});

If i translate Count: in output html, after click, the translated text will disappear.

Describe the solution you'd like

I think, qwik should provide an hoc that blocks hydration for everything inside.

Describe alternatives you've considered

https://github.com/maoberlehner/vue-lazy-hydration?ysclid=l9pp22gxzx261692481

Additional context

No response

polRk avatar Oct 26 '22 13:10 polRk