how to use props inside props in styled component in react js

IronManUTF8

I need to change the background color in condition wise ex below:

background-color: ${({bg})=>bg ? `${({theme})=>theme.color}`:#ffffff;

But its not working, can any one please help me with this?

muhammad ufo

use this way :

background-color: ${({ theme, bg })=> bg ? theme.color : #ffffff ;

you should use string instead of boolean like this :

<div bg='yes'>

background-color: ${({ theme, bg })=> bg === 'yes' ? theme.color : #ffffff

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

How to pass props of React component to styled component

How to pass props to styled component inside a loop

How to use props type from a styled component?

How to use Styled Components for a component passed as props

How to use this.props in React Styled Components

TS errors when trying to use props inside styled-component

Setting React component props in a Styled Component

Access props inside the styled component using MUI

How to pass props to keyframes in styled-component with react?

How to send props value to styled component in emotion react?

how to change image src using props with styled component and react

How can I specify the type for props in React Native styled component?

How to use styled-component CSS props with Typescript

How to use variable value in styled component that uses props?

React styled component not passing props from attribute

Using props inside react styled components

How to use generics in props in React in a functional component?

React Js how to handle props in child component

How to use props as component?

Can't use React link inside component with props

How to pass props to a component passed as props in React?

React component props not getting rendered inside Next.js Page

Render Props inside of Header Component Next.js React

React js Passing props to a component

React component props inside nested component

How to use styled-system responsive props

How to pass a component as props to another component in react js?

How to pass props to component inside a React Navigation navigator?

React. How to pass props inside a component defined on a prop?