为什么引导程序组件不起作用?

时间:2021-05-14 10:12:22

标签: javascript reactjs bootstrap-4 components

只是想检查为什么引导代码在反应组件中不起作用?我不明白它将如何工作。每当我检查网站时,它总是一个错误

import React from 'react';

function LoginForm() {
    return (
    <form>
        <form class="mb-3"></form>
            <label for="exampleInputEmail1" class="form-label">Email address</label>
            <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp">
        </form>
        <form class="mb-3">
            <label for="exampleInputPassword1" class="form-label">Password</label>
            <input type="password" class="form-control" id="exampleInputPassword1">
        </form>
        <form class="mb-3 form-check">
            <input type="checkbox" class="form-check-input" id="exampleCheck1">
            <label class="form-check-label" for="exampleCheck1">Check me out</label>
        </form>
        <button type="submit" class="btn btn-primary">Submit</button>
    </form>
    )
}

export default LoginForm

1 个答案:

答案 0 :(得分:0)

要在 React 中使用 Bootstrap,我建议您安装 react-bootstrapreactstrap 包:

react-bootstrap (Link)

npm i react-bootstrap | yarn add react-bootstrap

reactstrap (Link)

npm i reactstrap | yarn add reactstrap

不要忘记...

1/ 安装引导程序

npm i bootstrap | yarn add bootstrap

2/ 导入引导程序

src/index.js 中添加:import 'bootstrap/dist/css/bootstrap.min.css';