reactjs Flowbite-react浮动标签文档页面出错

ecr0jaav 于 12个月前发布在 React

关注(0)|答案(1)|浏览(124)

我想使用flowbite-react库中的浮动标签组件。页面上提供的代码片段从flowbite-react导入Spinner`。其他人遇到过这个问题吗？
flowbite-react floating label documentation page

import { Spinner } from 'flowbite-react';
    
function Component() {
  return (
    <div className="grid grid-flow-col justify-stretch space-x-4">
      <FloatingLabel variant="filled" label="Label" />
      <FloatingLabel variant="outlined" label="Label" />
      <FloatingLabel variant="standard" label="Label" />
    </div>
  );
}

字符串

reactjs

来源：https://stackoverflow.com/questions/77769449/error-in-flowbite-react-floating-label-documentation-page

1条答案

按热度按时间

hwamh0ep1#

导入FloatingLabel并使用它。这将起作用。

import { FloatingLabel } from 'flowbite-react';

字符串
如果没有，安装并设置Tailwind CSS以使用flowbite：

npm i autoprefixer postcss tailwindcss
npx tailwindcss init -p

型
将flowbite插件添加到tailwind.config.js，并包含来自flowbite-react的内容：

/** @type {import('tailwindcss').Config} */
export default {
  content: [
    // ...
    'node_modules/flowbite-react/lib/esm/**/*.js',
  ],
  plugins: [
    // ...
    require('flowbite/plugin'),
  ],
};

型
参考这个docs来正确设置tailwind和flowbite-react。然后它就可以工作了。

赞(0）回复(0）举报 12个月前

我来回答

reactjs Flowbite-react浮动标签文档页面出错

1条答案

相关问题

热门标签

最新问答