无法使用React在类之间传递道具

Question

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.3/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/0.14.3/react-dom.min.js"></script>

class carSelection extends React.Component {
    render(){
        return(
            <Button> {this.props.name} </Button>
        );
    }
}


class App extends Component {
    constructor(props) {
        super(props);
        this.state = {
            currentPage: 'Your Car',
            carSelected: null
        };
    }




    renderCarsList() {
        //const carNames = ['porsche', 'Ford', 'Subaru'];
        const carName = "Porsche";
        return (
            
            //{carNames.map((carName) => <carSelection name = {carName} />)} was inside div
            <div>
                <carSelection name = {carName} />
            </div>
        );
    }



    render() {
        const menuItems = [
            "Your Car"
        ];

        return (
            <Grid centered celled padded>
                <Grid.Row>
                    <Grid.Column width={2}>
                        {menuItems.map(item => (<Button fluid>{item} </Button>))}
                    </Grid.Column>
                    <Grid.Column width={10}>
                        {this.renderCarsList()}
                    </Grid.Column>
                </Grid.Row>
          </Grid>
          );
    }
}

export default App;

我正在尝试将道具从renderCarsList()传递到carSelection。像这样构建，但不显示任何按钮。我一直在尝试使用与反应井字游戏指南相同的方法。我也尝试使用carSelection作为函数，但是没有运气。

我无法对此form:<carSelection name = {carName} />做任何事情。当它是一个函数时，它可以使用carSlection()来工作，但是我不能传递类似的道具。

Answer 1

用大写import urllib.request response = urllib.request.urlopen(url) new_text2 = response.read() soup = BeautifulSoup(new_text2,'lxml') print(soup.text) 来写CarSelection。小写的名称被认为是HTML标记。

Answer 2

您不应在类名中使用驼峰式命名。尝试改用pascal命名。

例如：CarSelection

Answer 3

您的carSelection组件应将首字母大写。React会将带有大写小写字母的组件识别为本地html元素。