ITADN

[🐞] v2: Using result from `useAsync$` in an element's `style` does not resolve correctly

#8577OpenFloezeTv 创建于 2026-04-25
bugruntimereactivity
F
FloezeTvcommented
### Which component is affected? Qwik Runtime ### Describe the bug Using the result of a `useAsync$` call in an element's `style` does not resolve correctly and instead sets the element's `style`-attribute to `[object Object]`. Using the value in another way (e.g., `console.log`), causes the component to render correctly. Passing the value through some child-components and only using it as a `style` does not work, however. #### Example ```tsx export default component$(() => { const color = useAsync$<string>( () => new Promise((resolve) => setTimeout(() => resolve("red"), 1000)), ); // Logging the color's value causes the component to be rendered in red // console.log(color.value); return <div style={{ color: color.value }}>I should be red</div>; }); ``` ### Reproduction https://github.com/FloezeTv/qwik-useAsync-style ### Steps to reproduce - Create new Qwik v2 project (`npm create qwik@2.0.0-beta.32`) - Create a component that uses the result of `useAsync$` in an element's `style` - Check the component's `style` ### System Info ```shell System: OS: Linux 6.12 Manjaro Linux CPU: (16) x64 AMD Ryzen 7 5700U with Radeon Graphics Memory: 9.19 GB / 38.58 GB Container: Yes Shell: 5.9 - /bin/zsh Binaries: Node: 25.8.1 - /usr/bin/node npm: 11.11.1 - /usr/bin/npm pnpm: 10.32.1 - /usr/bin/pnpm bun: 1.3.11 - /usr/bin/bun Deno: 2.7.5 - /usr/bin/deno Browsers: Firefox: 150.0 Firefox Developer Edition: 150.0 npmPackages: @qwik.dev/core: ^2.0.0-beta.32 => 2.0.0-beta.32 @qwik.dev/router: ^2.0.0-beta.32 => 2.0.0-beta.32 typescript: 5.9.3 => 5.9.3 vite: 7.3.1 => 7.3.1 ``` ### Additional Information _No response_
0 条评论