プレゼンテーションコンポーネントによるマテリアルデザインのリアクション実装

Question

Material UIをステートレスコンポーネントで使用することは可能ですか、それとも必須ですか？

私はPopoversを実装しようとしていましたが、私が公式のcode exampleから集めたものは、それが国家統制だということです。

Answer 1

マテリアルUIコンポーネントによって異なります。

ステートレスコンポーネントとしては理想的なものもあり、推奨されるものもあります。実際、Material UIドキュメントの例の多くは、ステートレスなコンポーネントを使用しています。例えば、<Badge />成分：

const BadgeExampleSimple =() => (
    <div> 
    <Badge 
     badgeContent={4} 
     primary={true} 
    > 
     <NotificationsIcon /> 
    </Badge> 
    <Badge 
     badgeContent={10} 
     secondary={true} 
     badgeStyle={{top: 12, right: 12}} 
    > 
     <IconButton tooltip="Notifications"> 
     <NotificationsIcon /> 
     </IconButton> 
    </Badge> 
    </div> 
); 

または<Icon />：

const HomeIcon = (props) => (
    <SvgIcon {...props}> 
    <path d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z" /> 
    </SvgIcon> 
); 

他の成分はopenような状態を管理するために、ステートフルであるためにそれらを必要とします。

これは残念なことに<Popover />コンポーネントのケースです。

だから、

export default class PopoverExampleSimple extends React.Component { 

    constructor(props) { 
    super(props); 

    this.state = { 
     open: false, 
    }; 
    } 

    ... 
} 

、あなたの質問に答えるために：

• コンポーネントが
• 状態を必要としない場合は、[はい、それはありません、それはステートフルなコンポーネントを使用するための要件ではありませんステートレスなコンポーネントを使用することが可能ですコンポーネントが状態を必要としていない限り、