安装

npm i @astrouxds/react

导入和使用

首先,将 cs 导入到您的索引. js, app. js, 或者您想要的任何 CSS 文件 .

import '@astrouxds/astro-web-components/dist/astro-web-components/astro-web-components.css'

下一步, 导入任何想要的 Astro 组件 , 与您想要的类似 .

import { RuxProgress } from '@astrouxds/react

现在可以使用天体组件作为正则反应组件.

import React from 'react';

const MyComp = () => {
    return (
        <div>
            <RuxProgress />
        </div>
    )
}

export default MyComp;

Astro Stencil 组件文档

所有组件的文档可见于我们 Astro Stencil 故事手册, 我们 网络组件软件包

已知问题

• CSS 自定义的特性用于我们的反应- 被包装的组件未定义出框, 因此 CSS 导入的必要性 .
• 对于使用复选框、按下按钮或切换Ruxchange事件,您需要检查所检查的道具:

          <RuxSwitch
        value="switch"
        onRuxchange={(e: React.ChangeEvent<HTMLRuxSwitchElement>) =>
          setSwitchVal(e.target.checked ? e.target.value : "")
        }
      />