react component of iztro
![image](https://private-user-images.githubusercontent.com/6510425/268459976-f4335997-fdd8-42e2-bb1a-600942f9b0ba.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjE5NjQ5MDksIm5iZiI6MTcyMTk2NDYwOSwicGF0aCI6Ii82NTEwNDI1LzI2ODQ1OTk3Ni1mNDMzNTk5Ny1mZGQ4LTQyZTItYmIxYS02MDA5NDJmOWIwYmEucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDcyNiUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA3MjZUMDMzMDA5WiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9YWEzOWRiNDdkNjI0YjNiZDlhNTc0ZWNjZWNiN2UyYjFlNWUyNTczYjY4MTVlY2UxMTMwMTMzMTI4OTdkOGNlMyZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.AzcI91dOyHvGNBYSsOxsiIBCeRJTMl9fVSChUHFVbSQ)
npm install react-iztro -S
当然你也可以使用 yarn
yarn add react-iztro
import {Iztrolabe} from "react-iztro"
function App() {
return (
<div className="App" style={{ width: 1024, margin: '50px auto', boxShadow: '0 0 25px rgba(0,0,0,0.25)'}}>
<Iztrolabe
birthday="2003-10-12"
birthTime={1}
birthdayType="solar"
gender="male"
horoscopeDate={new Date()} // 新增参数,设置运限日期【可选,默认为当前时间】
horoscopeHour={1} // 新增参数,设置流时时辰的索引【可选,默认会获取 horoscopeDate 时间】
/>
</div>
);
}
export default App;
如此你就得到了上图所示的一张星盘。有兴趣的同学可以持续关注。记得给⭐️⭐️哦
如果你想将代码克隆到本地查看,可以用以下步骤进行
- 克隆代码
git clone https://github.com/SylarLong/iztro-docs.git
- 安装依赖
npm install
或者
yarn
-
启动
npm run storybook
或者
yarn storybook
-
预览
打开浏览器,输入 http:https://localhost:6006 即可预览。
如果你想对本程序进行贡献,可以 fork
本仓库到你的仓库里进行改进,完成开发或者修复以后提交 pull request
到本仓库。