D'une manière incluant le HTML (JSX), CSS et JS dans le même fichier est plus sur separation of concerns qu'une seule responsabilité. La préoccupation du composant React est de rendre un petit sous-ensemble d'informations à l'écran et le HTML (JSX), CSS et JS sont tous nécessaires pour cela, donc ils font partie de cette préoccupation.
D'autres écoles de pensée considéreraient ces éléments comme des préoccupations différentes, il s'agit donc beaucoup d'une question d'interprétation du modèle, plutôt que de quelque chose avec une réponse correcte et définitive. Pete Hunt a parlé spécifiquement de Seperation des préoccupations avec React à JSConf EU en 2013, you can see a video of that here et read the slide deck from that presentation here
En plus de la séparation des préoccupations, cette présentation explique également comment on peut dire que tous les éléments d'un composant dans le même fichier augmentent cohesion et encouragent loose coupling. Le résultat pratique de l'inclusion du code HTML (JSX), CSS et JS dans le même fichier est qu'il suffit de regarder un fichier pour bien comprendre le comportement du composant. Cela rend plus facile à comprendre pleinement le composant et aide reusability, en particulier par des tiers.
Facebook Christopher Chedeau a parlé de la raison pour laquelle ils recommandent de mettre CSS avec votre composant React à NationJS 2014. This is a video that talk et this is the slide deck.
Merci pour la réponse détaillée et les liens externes avec plus d'informations! –