styled-components make the event stream miss #6994
cieldon32
started this conversation in
Report issues other than bug
Replies: 1 comment
-
import styled from "styled-components";
const Component = (Dom) => styled(Dom)`
display: ${(attrs) => (attrs.hide ? "none" : "block")};
height: ${({ height }) => height};
background: ${({ background }) => background};
`;
export const Item = ({ children, name, ...props }: any) => {
const [state, setState] = useState({});
const store = useStore();
useEffect(() => {
const source$ = name ? store[name] : null;
if (source$) {
const sub = source$.subscribe((res: any) => {
console.log(name, res);
setState(res);
});
return () => {
sub.unsubscribe();
};
}
}, [store[name]]);
const Com = (props: any): React.FC<any> => (
<children.type {...children.props} {...props} />
);
const Demo = Component(Com);
return (
// <div data-name={name}>
<Demo {...state} />
// </div>
);
// return <children.type {...children.props} {...state} />;
}; Your code doesn't work because of this thing. You can't create components and render them inside another component. If you look at the console, Mui is warning you that you're also calling What does this have to do with rxjs? |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
code is here
https://codesandbox.io/s/nostalgic-sun-1kxy8m?file=/src/Item.tsx:794-884
Beta Was this translation helpful? Give feedback.
All reactions